dcsimg
www.webdeveloper.com
Results 1 to 2 of 2

Thread: Floating position problem

  1. #1
    Join Date
    Mar 2006
    Posts
    21

    Question Floating position problem

    Below is the style sheet that I'm working on. With the assistance of someone in this forum, I was able to get everything positioned as I needed it with the exception of one roll-over link. It is vertically in the correct position, but horizontally it is in the center of the center image. What type of margin/alignment can I add to the "mission" div to move it to the right approximately 75px without moving any other of the roll-overs?

    div {}

    img {
    border: solid 0;}

    .footer {
    text-align: center;}

    body {
    background-color: #000000;
    margin: 0;
    padding: 0;
    text-align: center;
    }

    #header {
    background-image: url(images/header.jpg);
    background-repeat: no-repeat;
    background-position: center top;
    margin: 0px;
    padding: 0px;
    height: 84px;}

    #Center { /*center image*/
    background-image: url(images/lgsun.jpg);
    background-repeat: no-repeat;
    background-position: center top;
    height: 380px;
    width: 550px;
    padding: 3px;
    margin: 0px auto;
    }
    #Photos { /*rollover image*/
    float: left;
    margin-top: 75px;
    width: 121px;
    height: 61px;
    }


    #Rhythms { /*rollover image*/
    float: right;
    margin-top: 75px;
    width: 149px;
    height: 65px;
    }


    #Mission { /*rollover image*/
    float: right;
    margin-top: 240px;
    width: 216px;
    height: 60px;}

    #Calendar { /*rollover image*/
    float: left;
    margin-top: 100px;
    width: 154px;
    height: 61px;
    }

    a:link {
    color: #DBBFB3;
    text-decoration: none;
    font-family: "Comic Sans MS";
    font-size: 20px;
    font-weight: bold;}

    a:visited {
    color: #885039;
    text-decoration: none;
    font-family: "Comic Sans MS";
    font-size: 20px;
    font-weight: bold;}

    a:hover {
    text-decoration: underline;
    font-family: "Comic Sans MS";
    text-align: center;
    font-size: 20px;
    font-weight: bold;}

    a:active {}

  2. #2
    Join Date
    Jan 2005
    Location
    Frankfort, KY, USA
    Posts
    6,167
    You might try a padding-top setting. That will push the text down, and not effect the rest of your layout, as a margin-top setting might.

    KDLA

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles