cross browser newbie question

Question

Попытка выяснить, как IE и Firefox (и любые другие браузеры) обрабатывают css для divs по-разному. Я установил три простых div, которые отлично отображаются в IE (7), но не отображают «право» в FireFox (3.0.8). Не сложно, просто нужна левая панель, заголовок и где-то для основного контента. По какой-то причине в FireFox заголовок отображается только при 400px w вместо 650px, как и следовало ожидать. Может ли кто-нибудь указать мне в правильном направлении, чтобы получить хорошую ручку?

Имейте клиентский макет, который я уже настроил таким образом, а затем понял, что FF перепутался. Можете ли вы отправить URL-адрес для этого, если сможете увидеть, что я пытаюсь сделать?

#container 
{ 
position: absolute; 
width: 900px; 
left: 50%; 
margin-left: -450px;   
top: 0%; 
height: 500px; 
background-color: Red; 
} 


#leftContent 
{  
width: 250px; 
float: left; 
height: 500px; 
background-color: Green; 
} 

#header 
{  
width: 650px; 
height: 150px; 
background-color: Lime; 
display: block; 
} 

Answer 1

попробовать

float:right; 

на #maincontent

update-

Answer 2

float:left Добавить к заголовку и MainContent.

#leftContent 
{  
    width: 250px; 
    float: left; 
    height: 500px; 
    background-color: Green; 
    float: left;  
} 

#header 
{  
    width: 650px; 
    height: 150px; 
    background-color: Lime; 
    display: block; 
    float: left; 
} 

#mainContent 
{ 
    background-color: Black; 
    height: 550px; 
    width: 650px; 
    float: left; 
} 

Answer 3

ftp не работает для меня. http://jsbin.com/ocare3/

Пробовал новый курс - добавлена ​​обертка для содержимого правой руки (#header и #mainContent) и плавала это. У вас также было в конце тела, но нет открывателя ... странно. В любом случае - это работает для всех моих браузеров. Возможно, вы захотите переадресовать значения высоты, которые вы использовали, чтобы убедиться, что все снова выстроено вверх