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

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

Это становится проблемой, когда у меня есть эта страница в 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>

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

источник

2009-02-15 rid00z

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

style="display: inline;"

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

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

Удачи вам!

источник

2009-02-15 23:43:38

Просто обратите внимание, что в соответствии со стандартами XHTML диапазон, содержащий другие элементы, недействителен, поэтому метод CSS лучше, хотя я не уверен, почему бы просто не установить внешний div и форму как ширину 200px. –

Согласно Ole J. Helgesen, встроенный блок может быть лучше, однако поддержка этого свойства плохо в некоторых старых браузерах. –

Вы просто взорвали мой разум. Вы просто приняли меня на следующий уровень развития веб-интерфейса и решили около 12 различных проблем, которые у меня есть. – pixelpax

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

display: inline-block;

источник

2009-02-16 00:58:24

Где ты был всю мою жизнь. –

Чтобы предотвратить скроллбар для #outerDiv можно установить максимальные ширины и переполнение свойство:

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

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

источник

2009-02-18 07:14:54 artlung

Хороший ответ! Это очень помогло мне в решении подобной проблемы! – MikeN

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

ответ

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