View Single Post
Old 03-14-2013, 06:02 PM   PM User | #4
ttkim
Regular Coder

 
Join Date: Mar 2013
Posts: 113
Thanks: 3
Thanked 29 Times in 29 Posts
ttkim is an unknown quantity at this point
I don't think you can put a fixed element inside a container.

Anyway, I've never tried something like this, but theoretically, this should work.

Code:
body {
    margin:0;
    padding:0;
}
#container {
    margin: 0 auto; /* Centering the container */
    width: 80%; /* Giving it a width of 80% */
}
.SideNavContainer {
    position:fixed;
    right: 10%;
}
Code:
<body>
    <div id="container">I am the container</div>
    <div class="SideNavContainer">I am the side nav</div>
</body>
The main container is centered as shown by margin: 0 auto;. The width is 80% so margin-left is 10% and margin-right is 10%.

Then, your .SideNavContainer has a fixed position that is 10% away from the right.

The main container's margin-right = .SideNavContainer's right.

Last edited by ttkim; 03-14-2013 at 06:07 PM..
ttkim is offline   Reply With Quote