Wrox Programmer Forums

Need to download code?

View our list of code downloads.

Go Back   Wrox Programmer Forums > Web Programming > CSS > CSS Cascading Style Sheets
Password Reminder
Register
| FAQ | Members List | Calendar | Search | Today's Posts | Mark Forums Read
CSS Cascading Style Sheets All issues relating to Cascading Style Sheets (CSS).
Welcome to the p2p.wrox.com Forums.

You are currently viewing the CSS Cascading Style Sheets section of the Wrox Programmer to Programmer discussions. This is a community of tens of thousands of software programmers and website developers including Wrox book authors and readers. As a guest, you can read any forum posting. By joining today you can post your own programming questions, respond to other developers’ questions, and eliminate the ads that are displayed to guests. Registration is fast, simple and absolutely free .
DRM-free e-books 300x50
Reply
 
Thread Tools Search this Thread Display Modes
  #1 (permalink)  
Old February 23rd, 2005, 10:36 AM
Authorized User
 
Join Date: Nov 2004
Location: York, , United Kingdom.
Posts: 14
Thanks: 0
Thanked 0 Times in 0 Posts
Default List Style & Positioning Help Needed

In building a gallery for a client I am required to create a thumbnail display system which displays the thumbnail on the left with the related information down the right of the image. All of this needs to be surrounded by a border.

The structure of my XHTML is as follows
Code:
<div class="imageThumb">
<img src="image.jpg" />[list]
<li>Title :</li>[list]<li>Title Goes Here</li></ul>
<li>Artist :</li>[list]<li>Name Goes Here</li></ul>
<li>Date :</li>[list]<li>##-##-####</li></ul>
</ul>
</div>
I need some way of getting the lists to display down the right of the image, and have the nested list to display on the same line as it's parent, ie.

Artist : Name

rather than

Artist :
Name

The page in question can be found at http://tfmwa.no-ip.com/sams/visual.php
There is a sample of what is currently happening, followed by an image which has been altered to better illustrate what I want to accomplish (there only wants to be the single dotted border however)

I also need the flow of this list to continue and not wrap under the image if the content of the list extends beyond the height of the image.

Any ideas would be greatly appreciated! ta!
Reply With Quote
  #2 (permalink)  
Old February 23rd, 2005, 02:56 PM
Authorized User
 
Join Date: Nov 2004
Location: York, , United Kingdom.
Posts: 14
Thanks: 0
Thanked 0 Times in 0 Posts
Default

Okay I appear to have got the layout as I desired but it invloved re-organising the structure of the XHTML, so it now reads

Code:
<div class="imageThumb">
<img src="intrusion.jpg" />
<div class="details">
    <ul class="detailItem">
        <li>Title : </li>
    </ul>
    <ul class="detailValue">
        <li>Intrusion</li>
    </ul>
    <ul class="detailItem">
        <li>Artist :</li>
    </ul>
    <ul class="detailValue">
        <li>Dan Nightingale</li>
    </ul>
    <ul class="detailItem">
        <li>Date :</li>
    </ul>
    <ul class="detailValue">
        <li>16-08-2004</li>
    </ul>
    <ul class="detailItem">
        <li>Media :</li>
    </ul>
    <ul class="detailValue">
        <li>Photography</li>
    </ul>
    <ul class="detailItem">
        <li>Category :</li>
    </ul>
    <ul class="detailValue">
        <li>Sky</li>
    </ul>
    <ul class="detailItem">
        <li>Description :</li>
    </ul>
    <ul class="detailValue">
        <li>A simple, minimal photograph showing that the contrast between nature  and modern technology</li>
    </ul>
</div>
</div>
I would like to keep it with a single list, with the "detailItem" as a nested ul

If anyone knows how to create this layout whilst keeping the structure a lot cleaner please let me know, otherwise it works and I'll have to make do..

Ta.
Reply With Quote
Reply


Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is Off
HTML code is Off
Trackbacks are Off
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Help Needed: Updating & Saving Database OnceANewbie BOOK: Beginning Visual Basic 2005 ISBN: 978-0-7645-7401-6 0 November 30th, 2008 10:05 PM
Positioning layers? Advice needed. Perkele Dreamweaver (all versions) 1 February 19th, 2007 02:43 PM
Style sheets & Menus arnabghosh Dreamweaver (all versions) 1 October 27th, 2005 04:09 PM
List tablesname from database & list databasename ittorget MySQL 3 September 10th, 2005 03:06 AM
Big Help Needed: VB6 & Crystal8.5 reyboy Crystal Reports 2 September 22nd, 2004 08:35 PM



All times are GMT -4. The time now is 02:09 PM.


Powered by vBulletin®
Copyright ©2000 - 2019, Jelsoft Enterprises Ltd.
© 2013 John Wiley & Sons, Inc.