This week's giveaway is in the Android forum.
We're giving away four copies of Android Security Essentials Live Lessons and have Godfrey Nolan on-line!
See this thread for details.
The moose likes HTML, CSS and JavaScript and the fly likes Menu image positioning Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login


Win a copy of Android Security Essentials Live Lessons this week in the Android forum!
JavaRanch » Java Forums » Engineering » HTML, CSS and JavaScript
Bookmark "Menu image positioning" Watch "Menu image positioning" New topic
Author

Menu image positioning

Srikkanth Mohanasundaram
Ranch Hand

Joined: Feb 07, 2007
Posts: 185
Hello all,

I've a menu of items to be displayed , so I'm making use of the UL LI tags to build the list and apply appropriate styling to them. The HTML list i'm using would roughly look like this



The li item marked with class name parent has CSS definition with a background image (something like the expand image or plus image) . I would want check for the onclick event on this image (I guess it cannot be done,since the image is not a part of the DOM) and call a function which would expand the node. Since i was not able to do it, i tried with something similar to this (changed the HTML on line no. 5 in the previous snippet)


But as you would have guessed ,i didn't get the image to position properly . It was like, the image was on one line and the the span gets rendered in the next. I need them to be inline. Can someone let me know on how it should be done?

Thanks,
Srikkanth
Ankit Garg
Sheriff

Joined: Aug 03, 2008
Posts: 9291
    
  17

Try to use style="float:left" with your image...


SCJP 6 | SCWCD 5 | Javaranch SCJP FAQ | SCWCD Links
Srikkanth Mohanasundaram
Ranch Hand

Joined: Feb 07, 2007
Posts: 185
Thanks Ankit that helped. I was under the impression that image elements would display inline. Can someone explain?

Thanks,
Srikkanth
Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 60810
    
  65

They will generally display inline, unless something else acts upon them, or the browser decides it needs to wrap for some reason.


[Asking smart questions] [Bear's FrontMan] [About Bear] [Books by Bear]
Srikkanth Mohanasundaram
Ranch Hand

Joined: Feb 07, 2007
Posts: 185
Thanks Bear. I will check if there is some other conflicting CSS rule.

Thanks,
Srikkanth
 
It is sorta covered in the JavaRanch Style Guide.
 
subject: Menu image positioning
 
Similar Threads
CSS not working in Firefox, works in IE
Can you read this?
selecting pure text in jquery
Problem using DIV tag
Not achieving space between div blocks containing lists