Как исправить самодельную сетку с 3-мя колонками?

Question

[dhat]

Пример простой сетки - codepen.io/dhatt/pen/VmPOQE

Как избавится от тонкого пространства справа? 100 на 3 не делится ровно...

зы: велосипед не изобретаю, просто разбираюсь в простых вещах.

Answer 1

[pashted]

как вариант: 33 + 33 + 34

codepen.io/Pashted/pen/yVgdRq

Comments

[Алена]

причем сотые части 33,33 +33,33+ 33,34

[dhat]

Элегантно, возьму на заметку.

Answer 2

[Ivan Stroykin]

width: 32%; и по 1% отступа с правой стороны каждого блока + у первого 1% слева. Это если уж в легком варианте сделать. А разбираться лучше на примере уже устоявшихся сетках. Посмотрите как это сделано в том же bootstrap

Comments

[dhat]

Да, надо разобрать с пяток фреймворков. Какую-то сетку на флексбоксе можете посоветовать исходя из личного опыта? Так-то я их много понаходил, но как они на практике интересно.

[Ivan Stroykin]

dhat: сам не использовал flexbox в полной мере, так как в моих проектах, к сожалению, акцент приходится скидывать так же на довольно старые браузеры. Из опыта знакомых, порекомендовать могу этот: flexboxgrid.com

Answer 3

[iBird Rose]

сделать как сделали бутсрап. для row отрицательный margin. а для col padding. codepen.io/anon/pen/XNpLwQ

Answer 4

[indigo_style]

FLEX

Comments

[dhat]

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

[indigo_style]

dhat: Сам еще разбираюсь, но как понял что flex хорош, пример обновил, кстати в bitstrap 4 будет уже flex, вот тут можете поглядеть может что то пригодится flexboxgrid.com

Answer 5

[Олег]

Как вариант скриптом получать ширину ) codepen.io/anon/pen/xRqKKd

Comments

[dhat]

У меня в Хромиуме на Убунте белая полоска осталась.

[Олег]

dhat: а так codepen.io/anon/pen/JbWPJM

[dhat]

Олег: кроме алерта ничего не изменилось)))

[Олег]

dhat: Сброс стилей не поможет? codepen.io/anon/pen/yVMBdX

[dhat]

Олег: загадочно скрипт работает - в некоторых положениях полоска есть, в некоторых нет))

Answer 6

[Владимир]

А и правда, на кой делать флоат, если флекс держат практически все браузеры?

Comments

[dhat]

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