Новая тема   Ответить

 S_Flash
Пытался решить такую задачу: Тянущийся дизайн из div в 2 колонки
---------------------------------------------------------------
| всё свободное пространство + min-width:400px | width:300px |
---------------------------------------------------------------
Если начать ресайзить браузер, то меняется размер только девой колонки.
Скрол появляется на ширине браузера меньшей 400px+300+px..
Очень напоминает фремы!

1) Идеально получается если использовать CSS3 calc()
div {display:inline-block}
div .left {width:calc(100% - 320px);min-width:400px}
div .right {width:300px}
но как всегда, самые очевидные и прикольные решения срежут 30% браузеров как минимум. В частности Opera (ох уж эта опера бля!) любой версии не поддерживает calc!

2) На сайте оперы есть решение замены
{box-sizing:border-box;width:100%;margin:0 40px}
как аналог
{width: calc(100% - 80px);margin: 0 40px;}
Но то ли я не врубаю, то ли оно работает только с левым отступом (если надо тянущуюся колонку иметь только справа!)

3) Может есть какое-то кроссбраузерное решение на ECMAScript?

 Joseph
А что, если сделать с помощью js и не париться?!

 S_Flash
Ну а 3й пункт о чём?!

 Joseph
Хорошо, а как оно может быть не кроссброузерным вообще? jQuery и в путь.
Или ты хочешь готовый шаблон? Тут надо гуглить будет.

 Joseph
=потерто=
Не верно разобрал задачу

Последний раз редактировалось: Joseph (04/05/13 в 01:21), всего редактировалось 4 раз(а)

 Stek
поставить любой css фреймворк и не парится с вечным написанием скелета и подгонкой под кучу браузеров.

К примеру http://twitter.github.com/bootstrap , можно пересобрать только лайаут под себя. В результате код получится:
Код:

 johndoe2
Код:

 ^Krot
johndoe2 писал:
Вот это правильный подход Смотрю последнее время и охуеваю что современные сайтостроители без jquery и фреймворков уже не могут и пару колонок сделать
Скоро блять чтоб написать Hello world будует требоваться какой нибудь .Net Framework мегабайт на 200

 johndoe2
^Krot писал:

Скоро маразм дойтет до того, что поколение школоло "сайтостроителей" будет считать jquery и bootstrap библиотеками с закрытым кодом, т.к. осилить не смогут

 Stek
^Krot писал:

Ты еще больше будешь охуевать, когда тебе понадобится сделать кросбраузерное решение и поддержку мобильных платформ. То, что в jquery, bootstrap идет автоматом или вставкой пары строк кода, для тебя будет изобретением велосипеда.

Я х.з. зачем изобретать велосипеды , если решение уже есть, оно оттестировано тысячами людей и на десятках браузеров. У нас на работе есть такой любитель дизайнер "только чистый код". Все красиво только до той поры, пока не начинаешь набивать данными или изменять структуру. Потом повеситься можно от всех самописный изменений и попыток совместить старый и новый css скрипты. А используй он тот же бутстрап, менялся бы только css внешних стилей, совершенно не трогая лайут и структуру.

 S_Flash
johndoe2 писал:

Ахуеть!

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

 Alex AWM
+1 за бутстрап

 AWD
при min-width забудьте про ие6-7. это не кроссбраузерное решение. садись, 4-

 Stek
Уже давно можно забить на тех, кто использует IE6-7

 AWD
когда верстаешь для кого-то - все как один поют "делай чтоб и под ие6 шло..." - не иначе. мысля - "я плачу, пускай ебется". хотя и ебли нету никакой. так, пару фич знать про маргины с паддингами и т.д...
ие6-7 по li юзают до ляма юзеров в день...
я просто не разделяю восторг людей от 3-х строк некроссбраузерного кода.
если для себя - годится. а на продажу - отимеет заказчик...

а вообще забили. людям нравится - пущай наслаждаются

 idk2045
сгодится и на продажу, если делает не верстальщик а кодер например. хочешь супер-хтмлкод - заказывай верстку отдельно и ниибет.

 AWD
дык я и кодер и верстальщик, поэтому такого себе позволить не могу совесть и максимализм не позволяют