Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2

Thread: Nesting DIVs

  1. #1
    New to the CF scene
    Join Date
    Jul 2005
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Nesting DIVs

    I'm a beginner with all this HTML/CSS stuff, sorry if this is a straightforward question.

    http://www4.ncsu.edu/~mpborkow/test.html

    Basically, I want the "Main text will go here" box to be aligned at the top of the page. Instead no matter what I do it begins below my navigation bar instead. How can I fix that?

    -Matt

  • #2
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    Lose the absolute position here
    Code:
    #inset {position: absolute;
    	width: 99%;
            left: 1%;
            top: 10px;
            background: url("graphics/cutecolorsbearbg2.gif");
            align: center;
            }
    You should be able to use margins and padding instead, also you need to float the nav to the left and there is no such thing as float:top. Only float:left; float:right; or float:none;
    Code:
    #inset {margin-top: 10px;
            margin-left:1%;
            background: url("graphics/cutecolorsbearbg2.gif");
            align: center;
            }
    And then float the nav
    Code:
    .navigation {margin-left: 5px;
                 margin-top: 5px;
                 margin-bottom: 5px;
                 width: 200px;
                 float:left;
                 background: url("graphics/cutecolorsbearbg3.gif");
                 text-align: center;
    	     }
    Your content should now move up by itself. You'll need to give a margin-left to the content to clear the width of the nav.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •