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 7 of 7
  1. #1
    New Coder
    Join Date
    Feb 2011
    Posts
    52
    Thanks
    10
    Thanked 1 Time in 1 Post

    Help with Div alignment

    Hey all, this is probably easy one. I'm just having some problems setting up my div tags. I cant seem to figure out why they are coming out like this:


    http://www.rossow-web.com/ryan/index.html


    This is how it was designed:

    http://www.rossow-web.com/ryan/Mock_vs1.jpg

    could someone look at the code and tell me what i'm doing wrong?

  • #2
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,675
    Thanks
    22
    Thanked 1,827 Times in 1,811 Posts
    Hello rastacssforum,
    Try making your CSS look like this -
    Code:
    #container2 {
    /*height: 300px;*/
    	width: 860px;
    margin: 0 auto;
    }
    #footercontainer {
    	background-image: url(../images/footerbck.jpg) ;
    	height: 166px;
    	width: 870px;
    margin: 0 auto;
    }
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad

  • #3
    New Coder
    Join Date
    Feb 2011
    Posts
    52
    Thanks
    10
    Thanked 1 Time in 1 Post

    i tried

    yea unfortunately that didnt work....i changed the css code and this is what i got...


    http://www.rossow-web.com/ryan/index.html


    how do i bring the middle container down to match this http://www.rossow-web.com/ryan/Mock_vs1.jpg....

    without moving the background image....
    Last edited by rastacssforum; 02-13-2011 at 02:51 AM.

  • #4
    Regular Coder
    Join Date
    Dec 2010
    Location
    California
    Posts
    201
    Thanks
    30
    Thanked 8 Times in 8 Posts
    try adding position:relative; and top:200px; to container 2


    adjust 200px till its down far enough

  • Users who have thanked eberdome for this post:

    rastacssforum (02-13-2011)

  • #5
    New Coder
    Join Date
    Feb 2011
    Posts
    52
    Thanks
    10
    Thanked 1 Time in 1 Post

    anyone can help?

    Does anyone have any advise on this issue?

  • #6
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,675
    Thanks
    22
    Thanked 1,827 Times in 1,811 Posts
    Oop, I was not looking at your bg image... sorry.
    Try this instead -
    Code:
    #container {
    	display:block;
    	background:url(../images/index_header.jpg) no-repeat 0 0;
    	width: 948px;
    	margin: 0 auto;
    overflow: auto;
    }
    
    
    #container2 {
    	width: 860px;
    /*	height: 300px;*/
    	margin: 230px auto 0;
    }

    You also have some markup errors that need to be fixed.
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad

  • Users who have thanked Excavator for this post:

    rastacssforum (02-13-2011)

  • #7
    New Coder
    Join Date
    Feb 2011
    Posts
    52
    Thanks
    10
    Thanked 1 Time in 1 Post

    Thank you both!

    Hey you guys are awesome! thank you both....

    eberdome's solution worked, but i will try Excavator's solution too.


    ....


  •  

    Posting Permissions

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