Alignment of Div tags change when previewed in browser.

Discussion in 'CSS' started by misha_val, Mar 27, 2009.

  1. #1
    Hi, when previewing my website on either firefox or internet explorer, body_1 and body_2 of the following code both change drastically. Both body_1 and body_2 contain images images and are next to each other.



    Here is my CSS code
    
    
    
    #header {
    	text-align: center;
    	margin: auto;
    	padding: 0px;
    	height: 107px;
    	width: 948px;
    	background-image: url(images/images_2/images/Header.gif);
    }
    #header_2 {
    	text-align: left;
    	margin: auto;
    	padding: 0px;
    	height: 194px;
    	width: 948px;
    	background-image: url(images/images_2/images/Header_2.gif);
    }
    #body_1 {
    	height: 520px;
    	width: 650px;
    	background-image: url(images/images_2/images/body_1.gif);
    	left: auto;
    	float: left;
    	margin-left: 22px;
    	padding: 0px;
    }
    #body_2 {
    	height: 520px;
    	background-image: url(images/images_2/images/body_2.gif);
    	background-repeat: no-repeat;
    	background-color: #999;
    	margin: 0px;
    }
    
    Code (markup):
    Being a noob to CSS, any help would be greatly appreicated. ;)
     
    misha_val, Mar 27, 2009 IP
  2. kemengr

    kemengr Peon

    Messages:
    33
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    What are the size of images?
     
    kemengr, Mar 27, 2009 IP
  3. misha_val

    misha_val Active Member

    Messages:
    200
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    58
    #3
    The one on the right(body_2) is W:298 H:520
    The left one (body_1) is W:650 H:520.
     
    misha_val, Mar 27, 2009 IP
  4. misha_val

    misha_val Active Member

    Messages:
    200
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    58
    #4
    Nevermind, got it to work.
     
    misha_val, Mar 27, 2009 IP