CSS re-вёрстка: сделать ширину=auto для 1 из элементов в диве, без размещения в столбец

[amz00m]

Есть широкий див, в нём находятся 2 элемента, 1-ый из них имеет фиксированную ширину.

Задача: приделать динамическую (изменяемую) ширину для 2-ого элемента, расположив оба элемента в одну строку.

Проблема: если установить 2-ому элементу width:auto, то в таком случае элементы размещаются в столбец, а надо в строку. Если установить для 1-ого элемента float:left, а для второго width:auto и float:right, то по идее всё должно решиться, но этого не происходит (firefox 3.5 + stylish).

Ещё я поигрался с display: table-row/table-column (пробовал и менять на другие возм. параметры), но ничего не изменилось. Как правильно выставить этот параметр и главное для кого? Для суб-элементов или для основного дива?

Подскажите пожалуйста, что я делаю не так?

Edited November 16, 2009 by amz00m

[amz00m]

Даже незнаю что те подсказать....

table-cell неработает в ие6-7, если это не критично, то делай так.

И задачу сразу ставь конкретно. Я то незнал что хтмл уже есть и его нельзя менять.

а не подскажете - как быть со схожей задачей?

Есть див .two_column в нём внутри 2 дива: .left и .right (расположены строкой).

Задача: сделать фиксированной ширину для .right и чтобы он был всегда справа, а для .left сделать динамическую ширину, и чтобы он был слева.

Пробовал код:

.two_column {display:table!important}

.left {display:table-cell!important;width:100%!important;float:left!important;}

.right {display:table-cell!important; float:right!important;}

Но тогда .left будет во всю ширину .two_column, а .right под .left, если же обоим поставить float:none, то становится почти как надо, но только наблюдается сразу масса проблем с отображением: .left почему отображается так, как-будто у него margin-top:50px и это не сдвинуть обратно даже через position:relative; top:-50px;, также при ресайзе окна появляется скролл бар, т.е. .left почти совсем не расайзится, как-будто для него задан min-width с большим значением.

Аа, извиняюсь, да, не читал, потому что мышинально ответил, тогда согласен, но эти вещи не поддерживает ИЕ6-7, как ты их поборол?

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

Пользователи ИЕ6-7 меня не волнуют вообще. Стили я пишу прежде всего для себя, пишу под браузеры уважающие CSS, т.е. если какой-нибудь браузер вроде осла (ие) или красного Очка (жОпера) не правильно что-то отображает - это их проблемы и проблемы юзеров выбравших себе говнобраузер.

Но мои юзерстили должны правильно отображаться даже в жопере, а уж про православный ФФ и новый гуглобраузер - тем более молчу.

[amz00m]

а не подскажете - как быть со схожей задачей?

Есть див .two_column в нём внутри 2 дива: .left и .right (расположены строкой).

Задача: сделать фиксированной ширину для .right и чтобы он был всегда справа, а для .left сделать динамическую ширину, и чтобы он был слева.

Пробовал код:

.two_column {display:table!important}

.left {display:table-cell!important;width:100%!important;float:left!important;}

.right {display:table-cell!important; float:right!important;}

Но тогда .left будет во всю ширину .two_column, а .right под .left, если же обоим поставить float:none, то становится почти как надо, но только наблюдается сразу масса проблем с отображением: .left почему отображается так, как-будто у него margin-top:50px и это не сдвинуть обратно даже через position:relative; top:-50px;, также при ресайзе окна появляется скролл бар, т.е. .left почти совсем не расайзится, как-будто для него задан min-width с большим значением.

Код

.right {float:right;}

.left {position:absolute;width:auto;margin-right:215px(ширина .right)}

решил мою проблему, но появилась новая: при ресайзе окна .left хреново ресайзится, как будто у него выставлен огромный min-width, и если его выставить вручную - ничего не меняется.

[amz00m]

очень жаль, что помочь мне никто так и не смог

[Clayton]

Ну, вы же учитесь уже сами думать чуть чуть. К тому же код вам уже давали выше.

div.right { float: right; width: 300px;}
div.left { overflow: hidden;}
div.two_column {width:60%;}

<div class="two_column">
<div class="right">Right</div>
<div class="left">Left</div></div>

так например)

Edited November 18, 2009 by Clayton

[Justnewone]

очень жаль, что помочь мне никто так и не смог

А мне очень жаль, что у Вас "знаний" не хватило понять, что Вам помогли.

[mishka]

А у меня даже както охота отпала помогать человеку который так опрометчиво налево и направо "херня, жопа, жопера, идут лесом...." (может не все слова точно передал, но суть та). Потом такой скажет гденибудь - "да там на г@внофоруме один уродец подсказал...". Может я и ошибаюсь. Но ТС на будующее - немного вежлевее надо быть.

[amz00m]

тема снова актуальна. Неужели нельзя средствами re-CSS вёрстки выполнить поставленное условие?