0

Relevant fiddle: http://jsfiddle.net/tc05vfee/

<div id="header">
    <div class="header-nav"><a id="branding" href="/">Branding</a></div>
    <div id="left-nav">
        <div class="header-nav"><a href="/global.php">nav item</a></div>
    </div>
</div>

It ends up with the #left-nav and child elements being pushed down a couple pixels.

I'm not sure why the nav item is being pushed down.

Tyler Sebastian
  • 9,067
  • 6
  • 39
  • 62
  • 3
    add `vertical-align: top;` to `#left-nav` - http://jsfiddle.net/6L8eqok9/ – Anonymous Sep 30 '14 at 01:32
  • @MaryMelody so what's making the container larger than it appears (is that not why it's being bumped down)? – Tyler Sebastian Sep 30 '14 at 01:36
  • Check this out - [Why is this inline-block element pushed downward?](http://stackoverflow.com/questions/9273016/why-is-this-inline-block-element-pushed-downward) – Anonymous Sep 30 '14 at 01:49

1 Answers1

0

Add float : left; to the containers, not the children :

http://jsfiddle.net/tc05vfee/1/

AlienWebguy
  • 76,997
  • 17
  • 122
  • 145