IMG alignment in a DIV tag...

liunx

Guest
Hi,
My problem is that I am trying to put some text and an image into the same div tag with the image aligned to the right- the purpose of this is that the div tag represents an item on a menu and the image is an arrow to show that there is a submenu available.

Right now the code looks like this:
<div class = menuItem> Consulting <img align='right' src='http://www.webdeveloper.com/images/whitearrow.jpg'/> </div>

But this causes the arrow to appear underneath the text. It is right justified as I want it but it too far down the screen. I have tried setting white space to nowrap and a few other things but nothing so far has helped.

Any suggestions of how to get the image to appear right-justified and on the same level as the text?why dont you use css and posotion it with absolute value and if not, use float: rightOriginally posted by xataku_nakusute
why dont you use css and posotion it with absolute value and if not, use float: right

position:absolute isn't really an option because where the menu appears is dynamically generated.

I tried putting in float:right but it is just causing the same issue as align:right--the image seems to appear on a line below the text.

Do I need to position the text to the left and the image to the right or what? I've tried tinkering around but so far the best I can do is make the image appear directly next to the text...which looks uneven in a larger menu, that's why I want it right justified.Try floating the text to the left, while you are floating the image to the right:

<div class="menuItem"><span style="float: left;">Consulting</span><img src='http://www.webdeveloper.com/images/whitearrow.jpg' style="float:right;" /></div>sometimes u guys might dig into css too much. try just put the image codes first and the text next.
 
Back
Top