html - Can't remove white space between header and navbar when using Materializecss -
i using materializecss framework materializecss.com. have simple image place above navbar materializecss , there small white space. checked source , there no margin, padding or border @ all. space goes away if put navbar above image not sure problem is.
<img id="header" src="/public/images/header.gif" alt="header"/> <nav class="grey darken-4"> <div id="navbar" class="nav-wrapper"> <ul id="nav-mobile" class="hide-on-med-and-down"> <li><a href="#">profile</a></li> <li><a href="#">skills</a></li> <li><a href="#">projects</a></li> </ul> </div> </nav>
i not using other css besides materializecss css file. ideas? don't think css has margins anywhere don't see when viewing source of elements.
edit: here jsfiddle: http://jsfiddle.net/0tl9up9s/ list elements aren't appearing because haven't copied on javascript can still see white space between image , navbar.
ok, think has fact image display:inline
, therefore has dimensions include line-height
.
setting image display: block
correct issue.
css
#header { display:block; }
or (html)
<img id="header" src="/public/images/header.gif" style="display:block" alt="header"/>
your fiddle: http://jsfiddle.net/0tl9up9s/1/
Comments
Post a Comment