Grow your CSS skills. Land your dream job.

Positioning ? How To Move My Nav Bar into the Branding Bar?

  • # December 14, 2009 at 11:06 pm

    [img]http://img.photobucket.com/albums/v26/csanders/Picture32.png[/img]

    I color coded my design to help with any help I may receive, I can’t get anything online right now. Essentially what I can’t figure out is how to get the blue part (navbar) up into the yellow part (the branding bar). I tried to absolutely position it and the whole blue portion collapsed. Can some one help.

    My HTML

    Code:

    My CSS

    Code:
    /* layoutstyles.css */

    /* Universal style rule */
    *{
    /* Block all browser default margins and padding */
    margin:0;
    padding:0;
    /* Temporary borders */
    order:dashed 1px #f00;
    }

    #wrapper{
    width: 60em ;
    background-color: #FFFFFF;;
    /* Center the wrapper */
    margin: 0px auto 0 auto;

    }

    #branding{
    background-color: #FFFF00;
    width: 100%;
    float:left;

    }

    #branding img{
    background-color: #FFFFFF;
    width: 60%;
    float:left;

    }

    /************* MAIN Navigation Button styles ****************/

    #navigation{
    float: right;
    background-color:#00FFFF;
    height: ;
    }

    #col1{
    text-align: center;
    padding: 10px;
    }

    #col2{
    text-align: center;
    padding: 10px;
    }

    #col3{
    text-align: center;
    padding: 10px;

    }

    #footer{
    color: #FFFFFF;
    background-color:#000000;
    border-top:thin dashed;
    margin-top: 3em;
    background-color:;
    text-align: center;
    clear: both;
    font-size: 9.5px;
    position: relative;

    }

    body{
    background: ;
    font-family:Arial, Helvetica, sans-serif;

    }

Viewing 1 post (of 1 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".