Shreygupta (Talk | contribs) |
Shreygupta (Talk | contribs) |
||
Line 1: | Line 1: | ||
<html> | <html> | ||
+ | |||
<head> | <head> | ||
<style> | <style> | ||
+ | |||
Line 14: | Line 16: | ||
display: none; | display: none; | ||
} | } | ||
+ | |||
/* Content styling */ | /* Content styling */ | ||
− | |||
− | |||
− | |||
− | |||
− | |||
#content { | #content { | ||
Line 32: | Line 30: | ||
margin: 0; | margin: 0; | ||
} | } | ||
+ | |||
+ | body { | ||
+ | margin: 0; | ||
+ | padding: 35.2px 0 0; | ||
+ | height: 100%; | ||
+ | font-family: "Lato", serif; | ||
+ | } | ||
+ | #logo { | ||
+ | float: left; | ||
+ | font-size: 20px; | ||
+ | } | ||
+ | #navbar { | ||
+ | list-style-type: none; | ||
+ | margin: 0; | ||
+ | padding: 0; | ||
+ | overflow: hidden; | ||
+ | background-color: #dddddd; | ||
+ | position: fixed; | ||
+ | width: 100%; | ||
+ | top: 0; | ||
+ | left: 0; | ||
+ | z-index: 2; | ||
+ | } | ||
+ | .navItem { | ||
+ | float: right; | ||
+ | } | ||
+ | .navItem a { | ||
+ | display: block; | ||
+ | padding: 8px; | ||
+ | } | ||
+ | #contentWrapper { | ||
+ | width: 100%; | ||
+ | position: relative; | ||
+ | } | ||
+ | |||
+ | #inPageNav { | ||
+ | width: 35%; | ||
+ | float: left; | ||
+ | display: block; | ||
+ | position: fixed; | ||
+ | } | ||
+ | |||
+ | #inPageNav ol { | ||
+ | display: block; | ||
+ | margin: 20% 20% 10% 20%; | ||
+ | padding: 0; | ||
+ | } | ||
+ | |||
+ | #inPageNav ol li { | ||
+ | display: block; | ||
+ | padding: 10px 0 10px 10px; | ||
+ | } | ||
+ | |||
+ | #inPageNav ol li:hover { | ||
+ | background-color: #ddd; | ||
+ | } | ||
+ | #content { | ||
+ | width: 65%; | ||
+ | float: left; | ||
+ | display: block; | ||
+ | padding: 50px 200px 50px 0; | ||
+ | box-sizing: border-box; | ||
+ | position: relative; | ||
+ | left: 35%; | ||
+ | height: 1000px; | ||
+ | z-index: 0; | ||
+ | } | ||
+ | #content h1 { | ||
+ | margin: 0 0 40px 0; | ||
+ | } | ||
+ | #content h2, h3 { | ||
+ | margin: 0 0 30px 0; | ||
+ | } | ||
+ | #content p { | ||
+ | margin: 0 0 30px 0; | ||
+ | line-height: 2; | ||
+ | } | ||
+ | nav { | ||
+ | position: fixed; | ||
+ | top: 0; | ||
+ | left: 0; | ||
+ | width: 100%; | ||
+ | height: 35.2px; | ||
+ | } | ||
+ | |||
Line 38: | Line 121: | ||
<body> | <body> | ||
− | + | <ul id="navbar"> | |
+ | <li id="logo">Logo here</li> | ||
+ | <li class="navItem"><a href="#news">News</a></li> | ||
+ | <li class="navItem"><a href="#home">Home</a></li> | ||
+ | <li class="navItem"><a href="#contact">Contact</a></li> | ||
+ | <li class="navItem"><a href="#about">About</a></li> | ||
+ | </ul> | ||
</body> | </body> | ||
+ | |||
</html> | </html> |
Revision as of 09:18, 7 October 2017