This week's giveaway is in the Spring forum.
We're giving away four copies of REST with Spring (video course) and have Eugen Paraschiv on-line!
See this thread for details.
The moose likes HTML, CSS and JavaScript and the fly likes Html Lists CSS Query Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login

Win a copy of REST with Spring (video course) this week in the Spring forum!
JavaRanch » Java Forums » Engineering » HTML, CSS and JavaScript
Bookmark "Html Lists CSS Query" Watch "Html Lists CSS Query" New topic

Html Lists CSS Query

Deep Nair

Joined: Dec 24, 2011
Posts: 13

I have a requirement to remove the use of tables and replace the code with html lists (ul, li). The html code to be replaced is as below

Tried multiple options using lists (ul, li) but could not achieve this display. The text on the right always went below the image using lists, I wanted the vertical text list (name, then age, then city) to be adjacent to the image i.e. the list should produce the same shape as produced by the above table.

Please let me know how this can be done via CSS with html lists.

Eric Pascarello

Joined: Nov 08, 2001
Posts: 15385
A list does not seem right for this mark up, but the basic idea is here:

See if you can make it work, if you struggle, post what you try here.

Zak Ruvalcaba

Joined: Feb 08, 2012
Posts: 29
Very quick mockup here but what about something like this:

I agree. Here's the link:
subject: Html Lists CSS Query
It's not a secret anymore!