Positioning Question RRS feed

  • Question

  • <form id="form1" runat="server"
        <div id="container"
            <div id="Title">Crazy Center</div> 
                <asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server"
    body { 
        background-color: #36310A; 
    #container { 
        background-color: #FFFFFF; 
        margin: 7px auto 7px auto; 
        height: 700px; 
        width: 90%; 
        position: relative; 
    #Title { 
        margin: 5px; 
        background-color: #313131; 
    Having trouble with positioning divs. I would like the title div to position in relation to the container div. That is, I want the title div to have 5 px of margin from the top of the container div. However, whenever I preview the page in Firefox the title div is positioning in relation to the top of the window; though it is positioning the way I want in IE 7. 
    Thank you for your help.
    Monday, March 2, 2009 8:15 AM


All replies

  • The first thing I would try is a different ID for the div since title is a reserved tag in html.
    Try something like mytitle or titlediv.

    FrontPage MVP
    Monday, March 2, 2009 2:45 PM
  • I believe that this is something I've run into before. Please see this thread and note the reply in which I discussed margin collapse: http://social.expression.microsoft.com/Forums/en-US/web/thread/5cfc52e9-2586-4a0d-a427-e61d42e4695a/

    If what I suspect is the case, you can add a small padding to the #container div to resolve the issue. As in the thread referenced, try just adding


    to the style for #container and see if that takes care of the problem. If not, we'll just have to go from there. ;-)

    • Marked as answer by Splanky47 Monday, March 2, 2009 4:45 PM
    Monday, March 2, 2009 3:41 PM
  • Adding the padding took care of it. Thank you.
    Monday, March 2, 2009 4:45 PM