6 replies [Last post]
striker
striker's picture
Offline
newbie
Here... there...
Last seen: 15 years 2 weeks ago
Here... there...
Timezone: GMT+2
Joined: 2007-04-13
Posts: 6
Points: 0

Hi again,

My list have a sigle thumbnail inside and display is inline, the idea is to get a row of images.

Problem is that the

  • contents tends to get aligned bottom and resulting effects is a bit strange when a thumbnail is higher than the rest.

    Is there any way to align the content inside a

  • to the top or to the center?

    Thanks!!

    striker
    striker's picture
    Offline
    newbie
    Here... there...
    Last seen: 15 years 2 weeks ago
    Here... there...
    Timezone: GMT+2
    Joined: 2007-04-13
    Posts: 6
    Points: 0

    Sorry I wrote code

    Sorry I wrote code directly... I mean:

    Hi again,

    My list have a sigle thumbnail inside and display is inline, the idea is to get a row of images.

    Problem is that the "li" contents tends to get aligned bottom and resulting effects is a bit strange when a thumbnail is higher than the rest.

    Is there any way to align the content inside a "li" to the top or to the center?

    Thanks!!

    thepineapplehead
    thepineapplehead's picture
    Offline
    Moderator
    Last seen: 3 weeks 4 days ago
    Timezone: GMT+1
    Joined: 2004-06-30
    Posts: 9683
    Points: 819

    Can you show us the code

    Can you show us the code you're using please?

    Verschwindende wrote:
    • CSS doesn't make pies

    striker
    striker's picture
    Offline
    newbie
    Here... there...
    Last seen: 15 years 2 weeks ago
    Here... there...
    Timezone: GMT+2
    Joined: 2007-04-13
    Posts: 6
    Points: 0

    Code

    Sorry... forgot to put the code...

    CSS code is a simple list

    ul {
    list-style : none;
    }

    li {
    display: inline;
    width: 150px;
    margin: 0;
    padding: 4px;
    }

    The HTML code is also simple:

    • />
    • />
    • />

    Problem is that images align top bottom and I wold like if possible to align them to top.

    Result now and desired result:

    Maybe I'm not using the right code or method to represent a tumbnail gallery, mybe "li" is not the best way to achive this task. Any idea will be welcome!!! Thanks!!

    Hugo
    Hugo's picture
    Offline
    Moderator
    London
    Last seen: 7 years 19 weeks ago
    London
    Joined: 2004-06-06
    Posts: 15668
    Points: 2806

    Did you try

    Did you try vertical-align:top; ?

    Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
    ----------------------------------------------------------------
    Please post ALL your code - both CSS & HTML - in [code] tags
    Please validate and ensure you have included a full Doctype before posting.
    Why validate? Read Me

    striker
    striker's picture
    Offline
    newbie
    Here... there...
    Last seen: 15 years 2 weeks ago
    Here... there...
    Timezone: GMT+2
    Joined: 2007-04-13
    Posts: 6
    Points: 0

    Hi, Yup, I tried

    Hi,

    Yup, I tried "vertical-align: top;" it does not work, or better said, it does overlap image lines...

    gary.turner
    gary.turner's picture
    Offline
    Moderator
    Dallas
    Last seen: 1 year 11 weeks ago
    Dallas
    Timezone: GMT-6
    Joined: 2004-06-25
    Posts: 9776
    Points: 3858

    Please define 'doesn't

    Please define 'doesn't work', and provide the exact code you used. I tried it with both floated list items and inline. Worked as expected.

    cheers,

    gary

    If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.