Need Help with Wordpress images in sidebar.

[hmansfield]

I have a wordpress blog. I would like to arrange the images in one of my my side bar widgets (that read HTML code), next to each other (Horizontally ), instead of vertically (the way the post automatically).

Can anyone give me some simple pointers in the right direction?
Thanks in advance, w/rep.

[longroad]

If your sidebar isn't wide enough for the images to sit together they will automatically be placed under one another.

[hmansfield]

If your sidebar isn't wide enough for the images to sit together they will automatically be placed under one another.

I will resize the images, but they will still show one under the other, by default...any help?

[hmansfield]

OK no I didn't..I still can't make them do the most important thing, that is have individual link on each one...right now, each set in the same row, link to the same place...still need help if anyone can, thanks.
Here is how I have them arranged, side by side:

<a class+"inline"href='http://astore.amazon.com/theclublifeshop-20?%5Fencoding=UTF8&node=96'><img src='http://www.mysite.com/my-content/uploads/2008/01/dj.png' border='0'title='DJ Equipment and Accessories'
a class+"inline"href='http://astore.amazon.com/digitaltvs42009-20?%5Fencoding=UTF8&node=11'><img src='http://www.mysite.com/my-content/uploads/2008/01/home-entertainemnt.png' border='0'title='HDTV, Plasma, & Home Theater Systems'></a>

What am I doing wrong?

[longroad]

How are you getting this code?

There is no such thing as class+"inline"

Get rid of class+"inline"

You will need to place an </a> after each image if you want the images to have their own link

[hmansfield]

How are you getting this code?

There is no such thing as class+"inline"

Get rid of class+"inline"

You will need to place an </a> after each image if you want the images to have their own link

OK...but when I do that...the images just post up vertically. I want them to be side by side, with their own individual link.

[SuzanneMarie]

The suggested code above is correct. If you simply place two of these in a row without a <p> or a <br>, they will be side by side, UNLESS the images are too big.

<a href="xxxxxx"> some text here</a>

Can you provide a link to reference the problem?

[hmansfield]

The suggested code above is correct. If you simply place two of these in a row without a <p> or a <br>, they will be side by side, UNLESS the images are too big.

<a href="xxxxxx"> some text here</a>

Can you provide a link to reference the problem?

Right hand side....the links to my aStore, "Visit the Club Life Entertainment Shop".
I have the images vertically now, I want to put them 2X2.

Link (http://www.124bpms.com)

They will fit side by side, but I can't make them have separate links.

[SuzanneMarie]

the top one is different than the others, all the ones below it have a <p> tag, this will make t hem stack vertically. But the top one doesn't have that tag so I'm guessing that it is the one you have been playing with?

Are you saying that you can EITHER have them side by side OR have them hyperlinked, but not both? That when you create the hyperlink anchor text then don't align side by side anymore?

in the css for your a img, you have a border width set. Try setting the border to 0px for your a img and see if that fixes it:
a img (line 20)

{

border-top-width: medium;

border-right-width: medium;

border-bottom-width: medium;

border-left-width: medium;

border-top-style: none;

border-right-style: none;

border-bottom-style: none;

border-left-style: none;

border-top-color: -moz-use-text-color;

border-right-color: -moz-use-text-color;

border-bottom-color: -moz-use-text-color;

border-left-color: -moz-use-text-color;

}


Can you paste the code you are using in the widget for the first sidebyside pair?

[hmansfield]

Well, I have since, just resolved to keeping them posted vertically, so as not to have it looks tupid on my site, but the above code is how I had it set up. They did align side by side, but both images clicked at the same time, to a single link


<a class+"inline"href='http://astore.amazon.com/theclublifeshop-20?%5Fencoding=UTF8&node=96'><img src='http://www.mysite.com/my-content/uploads/2008/01/dj.png' border='0'title='DJ Equipment and Accessories'
a class+"inline"href='http://astore.amazon.com/digitaltvs42009-20?%5Fencoding=UTF8&node=11'><img src='http://www.mysite.com/my-content/uploads/2008/01/home-entertainemnt.png' border='0'title='HDTV, Plasma, & Home Theater Systems'></a>

[SuzanneMarie]

Well, right, that's what the code you just posted SHOULD do.

you can try removign the border width from your a img tags. Then when you wrap each image in its own anchor tag, it won't take up additional space.

[hmansfield]

Ok thanks , I will give a try and let you know how it works out.
I appreciate you help.

[SuzanneMarie]

BEst of luck. Nice looking icons, by the way... did you make them?

[alextic]

More idea more expert.