2013-10-07 3 views
0

Есть два абсолютно одинаковых тега div. Цель состоит в том, чтобы не допустить, чтобы первый переместился над одним справа от размера окна до меньшей, чем общая ширина. стр. : Это происходит только в firefox.Абсолютное позиционирование и изменение размера окна

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <title>My HTML File</title> 
    <style> 
     body{ 
      direction: rtl; 
     } 
     #sidebar{ 
      position: absolute; 
      top: 0; 
      right: 0; 
      bottom: 0; 
      width: 300px; 
      min-height: 1000px; 
      background-color: #66ccff; 
     } 
     #content{ 
      position: absolute; 
      top: 0; 
      right: 300px; 
      bottom: 0; 
      left: 0; 
      min-width: 1100px; 
      background-color: #008844; 
     } 
    </style> 
</head> 
<body> 
<div id="sidebar"></div> 
<div id="content"> 
</div> 
</body> 
</html> 
+0

.... это способ, которым мы обычно не используем абсолютное позиционирование для адаптивного дизайна. –

+0

Я согласен с Diodeus, но в любом случае вы должны настроить jsfiddle. –

ответ

0

Удалить left: 0; из #content

#content { 
    position: absolute; 
    top: 0; 
    right: 300px; 
    bottom: 0; 
    /*left: 0;*/ 
    min-width: 1100px; 
    background-color: #008844; 
} 

JSFiddle

Смежные вопросы