Разтягане до текста..

S

Styl3rbg

Registered
Малко съм позабравил css и реших да пиша тук. Какво трябваше да се напише, за да може даден div да се разтяга до края не даден текст в div-a
 
Абсолютно нищо не трябва да пишеш, това си е по подразбиране. Ако не се разтяга значи си задал изрично width или height (ако не си задал на този елемент, значи си задал на родителския).

Ако и това не решава проблема значи имаш float елементи във въпросния div. Тогава след последния float-нат елемент трябва да изчистиш флоата с това примерно:


HTML: 
<div class="clear"></div>

[css].clear { clear: both; }[/css]
 
adrian, аз до колкото знам diva по подразбиране е 100% ? <div style="background-color:green">bla</div>

Докато span вече е inline елемент.
 
Не си прав. Един div по подразбиране е толкова голям колкото е съдържанието в него.
 
Ами може и аз да бъркам, но ако имаш два дива
<div style="background-color: red">bla</div>
<div style="background-color: green">bla</div>

Ако заема толкова, колкото текст има, не би ли трябвало втория див да се качи до първия.

Ако е флоатнат, тогава вече мога да се съглася.
 
lub4o, не разбирам естеството на коментара ти. Въпрос ли отправяш към мен или ми съобщаваш информация, която е донякъде вярна? (малко по-надолу ще разбереш защо е донякъде вярна)
Също така, да span е inline, което ще рече, че него не го вълнуват height и width, освен ако изрично не му зададеш да се държи като block елемент.


BBC91, всъщност и ти не си съвсем прав. Един див по подразбиране ще има width от 100% (не съвсем 100 де, защото се вадят margin, padding и border, но в общи линии заема цялата широчина на родителския елемент), а height е вече според съдържанието :)

EDIT: lub4o, във втория ти пост няма как да застанат един до друг дори да има място и за двата (освен ако не ги float-неш), защото точно това е работата на блоковите елементи - да няма нищо до тях или иначе казано да правят така, че следващия елемент да почва на нов ред (съответно и предходния елемент да си е на нов ред).
 
<div> е block елемент, както е <p>, <h1>.. и т.н.
Така, че ако няма приложен никакъв друг стил, всеки <div> застава един под друг и заема цялата ширина на родителския елемент.
Ако родителя е <body>, заема цялата страница.

Edit: Точно както adrian го описа преди мен :)
 
Точно diva заема цялата ширина на родителския елемент, но не зависи от това колко текст има в него. Освен ако не е float-нат.

adrian
"lub4o, във втория ти пост няма как да застанат един до друг дори да има място и за двата (освен ако не ги float-неш)"

Ако са inline, пак застават един до друг.

Както всеки span ще застане, до преходния, защото е inline.


css3 в примери
Тагъв div заема цялата ширина на родителския елемент върху страницата.

Тагът span заема такава част от дължината на реда в родителския елемент, каквато е необходима за изобразяването на неговото съдържание.


4353903y.jpg
 
lub4o каза:
Точно diva заема цялата ширина на родителския елемент, но не зависи от това колко текст има в него. Освен ако не е float-нат.
Увеличете...
Точно така :) 6+
 
lub4o каза:
...
adrian
"lub4o, във втория ти пост няма как да застанат един до друг дори да има място и за двата (освен ако не ги float-неш)"

Ако са inline, пак застават един до друг.

Както всеки span ще застане, до преходния, защото е inline.

...
Увеличете...

lub4o, във втория ти пост никъде ни си споменал, че тези div-ове са inline, а си пропуснал и най-съществената част на изречението ми, а именно:
"защото точно това е работата на блоковите елементи".

Да - всеки елемент се държи както му кажеш да се държи (а ако не го направиш се държи както е създаден да се държи). Аз говоря за общия случай, когато не си му опрял пистолет в челото и си му казал: "уважаеми div искам да се държи като inline елемент, ужасно много искам да приличаш на span"

Влизаме в някаква дискусия, чиято цел не виждам. Ако се чувстваш засегнат от някоя от моите поправки по постовете ти - погледни какво си писал, осмисли го добре, след това ВНИМАТЕЛНО прочети всяка буква от това, което аз съм написал и ще разбереш, защо съм те поправил.
И понеже съм тръгнал да те поправям. Това не е CSS 3 в примери, а важи като цяло за CSS :)

До автора на темата: съжалявам за лирическите отклонения. По мое мнение все пак можеш да намериш отговор на въпроса си в темата покрай и другите изписани неща. Ако все пак не намериш решение на проблема си аз лично се нуждая от повече информация за него.

EDIT: Всъщност не съм разбрал въпроса на Styl3rbg, който е искал точно това. Div-ът му да се държи като inline елемент. Все пак lub4o, прочети какво съм написал, няма да навреди :)
 
Трябва да си влезнал или регистриран, за да отговориш тук.

Back
Горе