I'm making a really simple html website with CSS and I was hoping on some feedback. A few notes:
There will be more content under this, but I want the starting screen to take up the full page and then scroll under it.
I've used a bit of a hack to remove the padding from the first list element
I've used a bit of a hack to remove spacing between list elements
I'm a bit unsure if I have to clear floats for the menu bar as it has no height at the moment. If so,
clear:floatdidn't seem to work.
* { padding: 0; margin: 0;}html,body { height: 100%;}a { text-decoration: none;}.header { height: 100%; width: 100%; background: lightgray; position: relative; text-align: center; min-height: 350px;}li { list-style: none;}.nav { display: block; padding: 20px;}.nav img { float: left;}.nav ul { float: right; font-size: 0;}.nav ul li { display: inline-block; font-size: 16px; padding-left: 10px;}.nav ul li:first-child { padding-left: 0px}.nav ul li a { padding: 0 10px;}<html><body><div class="header"><div class="nav"><img width="39" height="35" alt="" src="#"><ul><li><a href="#">Services</a></li><li><a href="#">Contact</a></li></ul></div><span class="billboard">Hello!</span> </div><div class="content">Test</div></body></html>