Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home › Forums › CSS › inline-block displayed list items don’t position along correctly

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • May 5, 2013 at 2:07 pm #44571
    isuru
    Participant

    I’ve come across this issue multiple times when I use

  • to position a set of say, divs horizontally. I set the display to inline-block and it appears fine at first. But when I add something inside the li tag or something, it ends up looking like [this!](http://i.imgur.com/0jPbA5q.jpg “”) Notice that they appear in different positions.

    I’ve created a pen [here](http://codepen.io/Isuru-Nanayakkara/pen/HAywp “”) to further demonstrate it.

    How can I correct this problem?

May 5, 2013 at 2:12 pm #134162
Paulie_D
Member

Try adding

vertical-align:top;

to the `li`

May 5, 2013 at 2:21 pm #134164
isuru
Participant

That works! Thanks a bunch :)

  • Author
    Posts
    • Viewing 3 posts - 1 through 3 (of 3 total)
    • The forum ‘CSS’ is closed to new topics and replies.