Jump to content
  • 0

Размер div под его содержание


Beck
 Share

Question

Вот тут задался вопросом. Можно ли div-у задать, что-то типа width:auto, чтобы его ширина автоматически подстраивалась под размер его содержимого.

Или в таких случаях всегда используют табличную верстку?

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

Link to comment
Share on other sites

21 answers to this question

Recommended Posts

  • 0
Можно ли div-у задать, что-то типа width:auto, чтобы его ширина автоматически подстраивалась под размер его содержимого.

А можно вообще не задавать, она по умолчанию авто будет и всё будет подстраиваться.

А вообще покажи задачу для начала.

Link to comment
Share on other sites

  • 0
А можно вообще не задавать, она по умолчанию авто будет и всё будет подстраиваться.

А вообще покажи задачу для начала.

Допустим имеется такая структура:

<div style="width:50%;margin:0px auto;">
<div>
<span>blablabla</span>
</div>
<div>
<span>blablablablablablablablabla</span>
</div>
</div>

Чтобы внутренние дивы не занимали 100%, а занимали именно столько, сколько текста в span.

На данный же момент они занимают все 100%

Edited by Beck
Link to comment
Share on other sites

  • 0

Проблемы будут в IE6.

ну уж коль рекомендовать inline-block; то выкладывайте уже полное решение :)

div {
display:-moz-inline-stack;/*Нужно для Firefox*/
display:inline-block; /*Не применяется в IE и Firefox*/
_overflow:hidden;/*фикс для IE6*/
*zoom:1;/*включаем hasLayout*/
*display:inline;/*при hasLayout true display:inline ведёт себя как display:inline-block*/
}

Link to comment
Share on other sites

  • 0
ну уж коль рекомендовать inline-block; то выкладывайте уже полное решение :)

div {
display:-moz-inline-stack;/*Нужно для Firefox*/
display:inline-block; /*Не применяется в IE и Firefox*/
}

Первый раз о таком слышу. Разве FF не поймет нормального CSS в этом случае?

Link to comment
Share on other sites

  • 0
Первый раз о таком слышу. Разве FF не поймет нормального CSS в этом случае?

3й поймет, а более рание версии - нет :)

по этому и нужно использовать проприоритарное значение от mozilla

Link to comment
Share on other sites

  • 0
Валидно

У меня не проходит.

Пишет

Ошибка значения : display -moz-inline-stack не является значением display : -moz-inline-stack -moz-inline-stack

P.S. Что-то не получается добавить ссылку на результат валидатора.

Edited by shvv
Link to comment
Share on other sites

  • 0
В общем сделал таблицу. Не понимаю, почему все так боятся таблиц. :)

У нее конечно есть свои минусы в некоторых ситуациях, но вот в таких случаях выручает.

в том то и дело - не различаете разницу между таблицами и блоками.

таблицы созданы не для создания каркаса, а для содержания табличных данных.

от них отказаться, пока что нельзя, но заменить в 90% случаем грамотной div-разметкой - правильное решение

Link to comment
Share on other sites

  • 0
Я думаю, а думаю я часто вдумчиво, что автор не любит любимого Владимирчика http://www.artlebedev.ru/tools/technogrett...l/align-center/

p.s. И очень зря.

А причем здесь ссылка про выравнивание по центру родительского блока?

Link to comment
Share on other sites

  • 0
А вы валидатору скажите, что это CSS3

Сегодня вычитал в спецификации, что свойства производителей браузеров не запрещены и должны просто игнорироваться ПА. http://www.w3.org/TR/2009/CR-CSS2-20090908...vendor-keywords

Но валидатор не признает такие CSS валидными...

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy