Два div, плавающие влево и вправо: как я могу держать их на одном уровне при изменении размера страницы? - PullRequest
Новая
       29

Два div, плавающие влево и вправо: как я могу держать их на одном уровне при изменении размера страницы?

2 голосов
/ 03 ноября 2010

С учетом следующего HTML: 

<!DOCTYPE html>
<html>
<body>
  <div id="container">
    <div id="left" style="float: left; background-color: #777; width: 500px;">
      Here is some content. Blah blah blah etc.
      <div style="height: 50px;">Some more content</div>
      And finally some more.
    </div>
    <div id="right" style="float: right; background-color: #aaa; width: 500px;">
      Here is some content. Blah blah blah etc.
      <div style="height: 50px;">Some more content</div>
      And finally some more.
    </div>
    <div style="float: clear;"></div>
  </div>
</body>
</html>

Что можно сделать с div#container или другим тегом, чтобы предотвратить перемещение div#right ниже div#left, когда я изменяю размер окна браузера так, что ширина окна меньше 1000px?

Ответы [ 4 ]

7 голосов
/ 03 ноября 2010

Установите min-width для вашего контейнера: 

#container {
  min-width: 1000px;
}
2 голосов
/ 03 ноября 2010

Присвойте #container DIV свойство min-width: 1000px, чтобы родитель всегда был достаточно широким, чтобы держать обоих детей рядом.

0 голосов
/ 03 ноября 2010

Контейнер div не закрыт в вашем коде. пожалуйста, проверьте его один раз и примените min-width: 1000px;

0 голосов
/ 03 ноября 2010

http://www.w3schools.com/css/default.asp Я изучил все свои CSS здесь, есть раздел о позиционировании, который очень полезен, я предлагаю прочитать его для того, над чем вы работаете сейчас, а также над будущими проектами.

Попытка: 

#container {
   position: relative;
}
...