Как создать ширину столбца в CSS, которая увеличивается с большими изображениями, но при этом остается размер по умолчанию для содержимого обычного размера? - PullRequest
Новая
       8

Как создать ширину столбца в CSS, которая увеличивается с большими изображениями, но при этом остается размер по умолчанию для содержимого обычного размера?

0 голосов
/ 26 марта 2010

Я создаю веб-страницу HTML5 с макетом в один столбец. По сути, это ветка форума с отдельными сообщениями.

Я указал в своем CSS-файле столбец шириной 600 пикселей и отцентрировал его в окне, используя margin: 0 auto;. Однако некоторые изображения в отдельных сообщениях имеют размер более 600 пикселей и выливаются из столбца.

Я бы хотел расширить отдельный пост, чтобы он подходил для больших изображений. Однако я хочу, чтобы все остальные сообщения по-прежнему имели ширину 600 пикселей.

Прямо сейчас я просто использую overflow:auto, что создаст полосу прокрутки, но это не идеально. Можно ли увеличить индивидуальную ширину поста для большего контента, оставаясь при этом фиксированным для обычного контента? Возможно ли это с использованием только чистого CSS?

Заранее спасибо!

Ответы [ 2 ]

3 голосов
/ 26 марта 2010

попробуйте использовать min-width: 600px вместо width, хотя это не будет работать в старых версиях Internet Explorer.

0 голосов
/ 27 марта 2010

Вы можете использовать display: table в div, которые содержат ваши сообщения.Вы можете увидеть эффект с этим примером разметки: 

<html>
  <head>
    <style>
      .post{
        margin:0 auto;
        border:1px solid red;
        display:table;
      }
    </style>
  </head>
    <body style="width:100%;border:1px solid blue;">
      <div class="post" style="width:600px;">
        asd
      </div>
    <div class="post" style="width:900px;">
      asd
    </div>
    </body>
</html>

Конечно, это не будет работать IE в версии 8

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...