Как сделать так, чтобы форма и Div имели максимальную ширину дочерних элементов - PullRequest
Новая
       13

Как сделать так, чтобы форма и Div имели максимальную ширину дочерних элементов

5 голосов
/ 16 февраля 2009

Мне было интересно, как сделать так, чтобы форма и Div имели максимальную ширину дочерних элементов. Например, в этом примере и форма, и externalDiv растягивают всю ширину страницы. Я бы хотел, чтобы форма и externalDiv имели ширину 200 пикселей.

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

<body>
<form name="myForm" method="post" action="#"  >
    <div id="outerDiv" >
        <div style="width: 200px">
        Both the form and outer div stretch 100%. I am wondering how I
        would get them to wrap tightly around the inner div.
        </div>
    </div>
</form>
</body>

Спасибо за ваше время и помощь.

Ответы [ 3 ]

7 голосов
/ 16 февраля 2009

Чтобы отобразить блок как встроенный элемент, вы можете использовать 

display: inline-block;
5 голосов
/ 16 февраля 2009

Я считаю, что «правильный» способ состоит в том, чтобы сделать их встроенными элементами: 

style="display: inline;"

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

Вы можете использовать span как контейнеры или просто добавить вышеуказанный стиль к своим элементам div.

Удачи!

1 голос
/ 18 февраля 2009

Чтобы запретить полосы прокрутки для #outerDiv, вы можете установить свойства max-width и overflow: 

#outerDiv {
  max-width: 300px;
  overflow: hidden;
}

Таким образом, вы гарантируете отсутствие полос прокрутки, и я предполагаю, что ширина фрейма никогда не превышает 300 пикселей. Также обязательно установите frameborder="0" в iframe и проверьте поля в теле включенного html.

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

Нет похожих вопросов

...