html - div text moving slightly upward even when ul child display set to none -


i'm bit new css forgive me shortcomings on side can't seem find solution problem anywhere else. i'm sure trivial haven't changed code before went wrong.

so have made website's navbar has 8 different div on , equally spaced each other. want have drop down when mouse hovers on of them. anyway, before created list(or comment it) child of div about us seems in position meant be. vertically centered , aligned other div 's content.

here's website before adding list child div: before here's after it: after

as can see, about us has moved above little.

here's jsfiddle: jsfiddle

(i advise view jsfiddle page @ 50% zoom level perspective of every div.)

please provide solution how can prevent happening , also, if you'd me additionally tell me how drop down on hover.

add line-height: 28px match height of #navbar , text aligned.

.nb_item {   display:inline-block;   width:auto;   padding:0px 10px;   color:#ffffff;   margin:auto;   text-align:center;   line-height: 28px; // add } 

jsfiddle


Comments

Popular posts from this blog

facebook - android ACTION_SEND to share with specific application only -

python - Creating a new virtualenv gives a permissions error -

javascript - cocos2d-js draw circle not instantly -