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
  1. #1
    Regular Coder
    Join Date
    Sep 2011
    Posts
    361
    Thanks
    39
    Thanked 0 Times in 0 Posts

    Positioning problem in CSS!

    Hello, I have a problem in CSS. I want to make an image appear on the right below my menu buttons, but I can't do it. See a screenshot of my web page attached below first!

    Do you see the the image on the right which is in pink and has a text written on it? I want it to display above the page, just below the web buttons on the right.

    Below are my codes for my DIV containers:

    The body

    body {
    width:1000px;
    background-color:#1e1e1e;
    margin:auto;
    }

    The wrap DIV container

    #wrap {
    width:1000px;
    height:1000px;
    background-image:url(images/background.png);
    background-position:top center;
    background-repeat:no-repeat;
    }

    The DIV container for the banner

    #banner {
    margin-top:5px;
    margin-bottom:2px;
    padding-left:100px;
    }

    The DIV container for the menu

    #menu {
    margin-top:7px;
    padding-left:120px;
    border-top:2px solid orange;
    border-bottom:2px dashed orange;
    }

    The DIV container for the content (The one which has the yellow background saying Welcome...)

    #content {
    width:400px;
    height:200px;
    background-image:url(images/contentb.png);
    background-repeat:no-repeat;
    background-position:right 2%;
    margin-top:15px;
    padding-left:5px;
    }


    h1 {
    text-align:center;
    color:purple;
    font-style:italic;
    }

    .sub {
    text-align:center;
    color:green;
    font-style:oblique;
    font-weight:bold;
    }

    p {
    text-align:center;
    color:#007fff;
    font-style:oblique;
    font-weight:bold;
    }

    The DIV container for the pink image I'm having problem

    #design1 {
    float:right;
    }


    Please help, again, I want the pink image to display below the web buttons on the right. Thank you! Please help! :(
    Attached Thumbnails Attached Thumbnails Positioning problem in CSS!-screenshot.jpg  

  • #2
    Regular Coder
    Join Date
    Sep 2011
    Posts
    361
    Thanks
    39
    Thanked 0 Times in 0 Posts
    I done it finally! I took the DIV container of the pink image and put it above the DIV container for the content! and it works!


  •  

    Tags for this Thread

    Posting Permissions

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