You are truly a genius! Thank you!
Quote:
Originally Posted by sunfighter
Play with this:
Code:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
body {
margin:0;
padding:0;
}
#container {
margin: 0 auto;
width: 90%;
height: 100%;
padding-bottom: 10px;
border: 1px solid blue;
}
.SideNavContainer {
position:fixed;
right: 5%;
top: 10px;
border: 1px solid red;
color: white;
background-color:#000;
text-align:center;
border:thick #FFF solid;
border-radius:30px;
transition: all 5s ease;
-webkit-transition: all 5s ease;
-moz-transition: all 5s ease;
-o-transition: all 5s ease;
-ms-transition: all 5s ease
}
#main {
position:relative;
right: 1%;
padding-left: 2%;
padding-right: 2%;
margin-left: 2%;
width: 70%;
height: 100%;
border: 1px solid red;
}
</style>
</head>
<body>
<div id="container">I am the container
<div id="main">
I am the main body<br />
I am the main body<br />
I am the main body<br />
I am the main body<br />
I am the main body<br />
I am the main body<br />
I am the main body<br />
</div>
<div class="SideNavContainer">
I am the side nav<br />
I am the side nav<br />
I am the side nav<br />
I am the side nav<br />
</div>
</div>
</body>
</html>
|