Динамическая ширина — CSSCSS

Разбираемся в CSS
Ответить
Anonymous
 Динамическая ширина — CSS

Сообщение Anonymous »

Кто-нибудь знает, достижимо ли с помощью CSS следующее?

Я хочу, чтобы div.title и div.spacer занимали 100 % ширины div. row.

Моя цель — создать панель с вкладками. Я очень близок к этому, просто не могу придумать, как установить ширину.spacer, чтобы заполнить оставшееся пространство в div.row

Вот скриншот того, что я делаю:

Изображение


Вот скрипка: http://jsfiddle.net/yux2jr1n/

Код: Выделить всё

.row {
width: 100%;
display: block;
display: content-box;
margin: 0 auto 15px auto;
border-left: solid 2px rgba(0, 0, 0, 0.3);
border-right: solid 2px rgba(0, 0, 0, 0.3);
border-bottom: solid 2px rgba(0, 0, 0, 0.3);
border-radius: 0px 8px 8px 8px;
-moz-border-radius: 0px 8px 8px 8px;
-webkit-border-radius: 0px 8px 8px 8px;
padding-top: 2em;
padding-bottom: 2em;
text-align: left;
max-width: 1200px;
}
.tab {
margin-top: -60px;
display: content-box;
float: left;
width: 100%
}
.spacer {
border-bottom: solid 2px rgba(0, 0, 0, 0.3);
float: right;
}
.title {
border-left: solid 2px rgba(0, 0, 0, 0.3);
border-right: solid 2px rgba(0, 0, 0, 0.3);
border-top: solid 2px rgba(0, 0, 0, 0.3);
border-radius: 8px 8px 0px 0px;
-moz-border-radius: 8px 8px 0px 0px;
-webkit-border-radius: 8px 8px 0px 0px;
float: left;
width: auto;
}
.clearfix {
display: block;
clear: both;
width: 100%;
}

Код: Выделить всё



My Work



Some Content



Подробнее здесь: https://stackoverflow.com/questions/280 ... -width-css
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «CSS»