0 Пользователей и 1 Гость просматривают эту тему.
  • 159 Ответов
  • 15998 Просмотров
*

Pazys

  • Завсегдатай
  • 1738
  • 241 / 4
  • <a>А где я ошибся-то?</b>
я думаю на западном не будут искать дизайнера со знанием всего и проф верстки за 800 баксов ))

"со знанием всего", "проф верстки" - там никто не ищет вообще такого. Там ищут специалистов в своем деле, а не автомотовелофототелерадиомонтера.
Ишак меня нюхал ...
Если помог - плюсуйте в карму.
*

ELLE

  • Глобальный модератор
  • 4510
  • 893 / 0
села один сайт переносить с полторашки на 2.5 и думаю - дай забацаю сразу шаб на бутстрапе - пока все нравится - удобно))
не нравится только как у нас в блогах пишут про внедрение бутстрапа в шаблоны Joomla, у новичков, кто захочет попробовать - 100% не заведется. а так как некоторые к тому же слепо делают и не могут пользоваться отладкой - даже не поймут в чем проблема и бросят
*

Fedor Vlasenko

  • Живу я здесь
  • 3845
  • 733 / 7
  • https://fedor-vlasenko.web.app
*

NightGuard

  • Живу я здесь
  • 2927
  • 378 / 7
  • вжжж-вжжж
Недавно на хабре публиковали анонс http://maxmert.com/
Это по сути тот же bootstrap - вид в профиль.
« Последнее редактирование: 31.01.2013, 02:45:21 от NightGuard »
Идеология сверхпотребления более опасна для человечества, чем идеология гитлеровского тоталитаризма
*

al-teen

  • Глобальный модератор
  • 2385
  • 224 / 10
  • im
Хрень какая то. Изматерился на этом сайте, пока тыкал на js виджеты и ждал когда они подгрузятся. А еще дойдя до середины страницы оказываешься словно в лесу. Собственно, не понял в чем там качественные отличия от bootstrap. Лучше покажите сетку, которая не ломается при неравной высоте ячеек, плюс еще и адаптивится. Пока такой не встречал. Это очень большой недостаток, как грид960, бутстрап, так и всех остальных CSS фрэймворков, с которыми доводилось работать.
« Последнее редактирование: 31.01.2013, 05:00:32 от al-teen »
*

NightGuard

  • Живу я здесь
  • 2927
  • 378 / 7
  • вжжж-вжжж
Есть одна интересная вещица, недавно использовал - http://masonry.desandro.com/
Идеология сверхпотребления более опасна для человечества, чем идеология гитлеровского тоталитаризма
*

Pazys

  • Завсегдатай
  • 1738
  • 241 / 4
  • <a>А где я ошибся-то?</b>
Хрень какая то. Изматерился на этом сайте, пока тыкал на js виджеты и ждал когда они подгрузятся. А еще дойдя до середины страницы оказываешься словно в лесу. Собственно, не понял в чем там качественные отличия от bootstrap. Лучше покажите сетку, которая не ломается при неравной высоте ячеек, плюс еще и адаптивится. Пока такой не встречал. Это очень большой недостаток, как грид960, бутстрап, так и всех остальных CSS фрэймворков, с которыми доводилось работать.

Они не ломаются. Дайте пример где они ломаются - я такого не видел.
Ишак меня нюхал ...
Если помог - плюсуйте в карму.
*

Alldar

  • Завсегдатай
  • 1504
  • 195 / 1
Цитировать
Лучше покажите сетку, которая не ломается при неравной высоте ячеек, плюс еще и адаптивится. Пока такой не встречал.
Любую используй с display:inline-block в место float. Вообще если у вас что то ломается то значит ячейки просто не в контейнере row(как пример)

Цитировать
Это по сути тот же bootstrap - вид в профиль.
Концепция врестки вообще полностью другая

*

al-teen

  • Глобальный модератор
  • 2385
  • 224 / 10
  • im
Они не ломаются. Дайте пример где они ломаются - я такого не видел.
Во вложении.

Любую используй с display:inline-block в место float. Вообще если у вас что то ломается то значит ячейки просто не в контейнере row(как пример)
А если нет возможности каждый новый ряд обернуть в row? display:inline-block; решает задачу, но имеет проблемы со старыми версиями браузеров.

[вложение удалено Администратором]
*

Alldar

  • Завсегдатай
  • 1504
  • 195 / 1
какие это интересно проблемы?) С IE6 если только
*

Pazys

  • Завсегдатай
  • 1738
  • 241 / 4
  • <a>А где я ошибся-то?</b>
Код: css
.show-grid{margin:100px;}
.span1{background:#ccc;padding:30px;margin-top:20px;}

Это уже не бутстрап - вы переписали правила. Если эти правила убрать и создать контейнер, либо для резинки использовать суффикс -fluid - то ничего подобного не будет.

Ишак меня нюхал ...
Если помог - плюсуйте в карму.
*

al-teen

  • Глобальный модератор
  • 2385
  • 224 / 10
  • im
Код: css
.show-grid{margin:100px;}
.span1{background:#ccc;padding:30px;margin-top:20px;}

Это уже не бутстрап - вы переписали правила. Если эти правила убрать и создать контейнер, либо для резинки использовать суффикс -fluid - то ничего подобного не будет.


Да ладно? Наверное серый фон все поломал. grid-2 Контейнер создал и убрал стили. Хороший FW. По части кнопочек, оформления таблиц, элементов формы и т.д. Сетка впрочем тоже не плохая, но это косяк большинства аналогичных сеток. Сделайте контейнер, уберите стили... Пробовал много чего. Единственное рабочее решение данной проблемы inline-block.

[вложение удалено Администратором]
*

Alldar

  • Завсегдатай
  • 1504
  • 195 / 1
Цитировать
padding:30px;

Это вообще 5 баллов за верстку))) зачем сетка тогда? как вы высчитываете ширину верно?)))
*

Pazys

  • Завсегдатай
  • 1738
  • 241 / 4
  • <a>А где я ошибся-то?</b>
Да ладно? Наверное серый фон все поломал. grid-2 Контейнер создал и убрал стили. Хороший FW. По части кнопочек, оформления таблиц, элементов формы и т.д. Сетка впрочем тоже не плохая, но это косяк большинства аналогичных сеток. Сделайте контейнер, уберите стили... Пробовал много чего. Единственное рабочее решение данной проблемы inline-block.

Ну я точно не про бэк говорил. А вот отступы - это уже переписывание правил.
Решение проблемы - сделать span12 а в нем что-угодно (свои стили). Да и в целом, сетку не переписывайте. Если охота сделать бек серым цветом, то добавьте class="span2 gray" ну и CSS .gray {background-color: #ccc;}

Конкретно с вашей проблемой я как-то сталкивался и вроде решил с помощью min-height и max-height
Ишак меня нюхал ...
Если помог - плюсуйте в карму.
*

al-teen

  • Глобальный модератор
  • 2385
  • 224 / 10
  • im
Это вообще 5 баллов за верстку))) зачем сетка тогда? как вы высчитываете ширину верно?)))
Да хоть 10. Разве отступы в данном конкретном случае ломают структуру? Нет? Тогда зачем заострять внимание на них? Я лишь показал наглядно проблему. И ни padding, ни background, опять же, в данном конкретном случае, проблему не создают. По поводу высчитывания отступов, если требуются иные числа, отличные от дефолтных, пусть этим занимается http://twitter.github.com/bootstrap/customize.html

Конкретно с вашей проблемой я как-то сталкивался и вроде решил с помощью min-height и max-height

Пробовал. Макет был c row-fluid, адаптивный. На широких мониторах 3 колонки в контент-блоке с блоками информации span4, менее 767px перестраивался в 2 колонки. min-height и max-height в данном случае никак не помогли. Пробовал даже через evalHeight js, но решение оказалось деревянным.
*

Pazys

  • Завсегдатай
  • 1738
  • 241 / 4
  • <a>А где я ошибся-то?</b>
Я в таких случаях использую ul>li с фиксированной высотой
Ишак меня нюхал ...
Если помог - плюсуйте в карму.
*

al-teen

  • Глобальный модератор
  • 2385
  • 224 / 10
  • im
Я в таких случаях использую ul>li с фиксированной высотой
В том случае высота ячеек могла изменяться.
*

Pazys

  • Завсегдатай
  • 1738
  • 241 / 4
  • <a>А где я ошибся-то?</b>
Тогда мне непонятно ничего. Допустим 1 ячейка (из 3-х с строке) высотой 1000px, остальные по 100px - тогда это безобразие, так нельзя.

Высота могла менятся в каком случае?
Ишак меня нюхал ...
Если помог - плюсуйте в карму.
*

al-teen

  • Глобальный модератор
  • 2385
  • 224 / 10
  • im
Разбег конечно не настолько большой. Но в данном случае даже один пиксель ломает структуру. Все блоки по 100, а один 101. И все начинает плыть.

Высота могла меняться незначительно. Стояло ограничение описания товара по символам. Где то в описании попадались цифры. В итоге получалось на одну строчку больше. Вот так она и менялась.
*

Pazys

  • Завсегдатай
  • 1738
  • 241 / 4
  • <a>А где я ошибся-то?</b>
Ну дык вертикальный отступ вниз добавит "воздуха" и даст запас на еще 1 строчку для букв.
Как вариант: блок с фиксированной высотой и спрятанным, что не влезло - при наведении мышью высота становится 100%
Ишак меня нюхал ...
Если помог - плюсуйте в карму.
*

al-teen

  • Глобальный модератор
  • 2385
  • 224 / 10
  • im
Ну дык вертикальный отступ вниз добавит "воздуха" и даст запас на еще 1 строчку для букв.
Как вариант: блок с фиксированной высотой и спрятанным, что не влезло - при наведении мышью высота становится 100%

Не забывайте, row-fluid. Все блоки тянутся. Вертикальный отступ вниз все так же увеличивает высоту всех блоков. Это при неизвестной высоте. Получаем то, с чего и начали. Так как блоки сами резиновые, там не может быть никаких ограничений высоты. В противном случае получим очень большой отступ, при максимальной ширине. И да, мы же не меняем отступы блоков? Как их потом высчитывать? :)
*

Pazys

  • Завсегдатай
  • 1738
  • 241 / 4
  • <a>А где я ошибся-то?</b>
Ничего не понял.
Кроме отступов боков - меняем не отступы блоков, а отступы содержимого блоков.
Ишак меня нюхал ...
Если помог - плюсуйте в карму.
*

al-teen

  • Глобальный модератор
  • 2385
  • 224 / 10
  • im
Ничего не понял.
Кроме отступов боков - меняем не отступы блоков, а отступы содержимого блоков.
А разница? Все равно содержимое выравнивает блок под себя. Если размеры не не заданы точно.

Если мы задаем отступ для содержимого блоков, чтобы оно нормально отображалось когда колонка сужена, то неизменно получаем слишком большой отступ вниз, когда содержимое растянуто. Это в случае с фиксацией высоты. С нефиксированной высотой отступы никак не помогут сохранить структуру, если какой то из блоков будет длиннее других.
Я не знаю, как еще объяснить, видимо не обладаю талантом рассказчика.
*

Pazys

  • Завсегдатай
  • 1738
  • 241 / 4
  • <a>А где я ошибся-то?</b>
Для этого используем @media(min-width:XXXpx) and (max-width:XXXpx){...}
Ишак меня нюхал ...
Если помог - плюсуйте в карму.
*

al-teen

  • Глобальный модератор
  • 2385
  • 224 / 10
  • im
Для этого используем @media(min-width:XXXpx) and (max-width:XXXpx){...}
Для чего "этого"?
*

Pazys

  • Завсегдатай
  • 1738
  • 241 / 4
  • <a>А где я ошибся-то?</b>
Если мы задаем отступ для содержимого блоков, чтобы оно нормально отображалось когда колонка сужена, то неизменно получаем слишком большой отступ вниз, когда содержимое растянуто. Это в случае с фиксацией высоты. С нефиксированной высотой отступы никак не помогут сохранить структуру, если какой то из блоков будет длиннее других.
Вот для этого. Там где мы получаем слишком большой отступ вниз - регулируем той самой медией.
Ишак меня нюхал ...
Если помог - плюсуйте в карму.
*

al-teen

  • Глобальный модератор
  • 2385
  • 224 / 10
  • im
Вот для этого. Там где мы получаем слишком большой отступ вниз - регулируем той самой медией.

Что то подобное вроде тогда и делал. Причем "медий" получилось чуть ли на каждые 10 пикселей разбега. Показалось слишком деревянным решением.
*

Alldar

  • Завсегдатай
  • 1504
  • 195 / 1
Цитировать
Разве отступы в данном конкретном случае ломают структуру? Нет?
Ну как нет?

span1 это ширина одной колонки вы прибавляете к нему еще 40px у вас ширина колонки + 60px вы сломали сетку
« Последнее редактирование: 01.02.2013, 16:25:03 от Alldar »
*

al-teen

  • Глобальный модератор
  • 2385
  • 224 / 10
  • im
Ну как нет?

span1 это ширина одной колонки вы прибавляете к нему еще 40px у вас ширина колонки + 60px вы сломали сетку
Это я понимаю. Но в данном конкретном случае я демонстрировал, как ломается сетка при неравной высоте ячеек. При нарушении ширины ячейки, сетка сломается от последнего в ряду элемента. Но никак не от предпоследнего. Так что тут дополнительный отступ вообще никаким местом к проблеме не относится.
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться