Новые ответы с меткой flexbox
0
голосов
Принятый
Как задавать одинаковую высоту элемента grid в зависимости от максимальной высоты
Ошибка в том, что array.prototype.map проходился по стилями свойства не работали. Нужно создать дополнительную обертку и обернуть список. И этой обертке присвоить стили ниже.
const Wrapper = ...
1
голос
Принятый
Как правильно сделать флексы
Что-то в svg явно не так
Вам так нужно?
body {
box-sizing: border-box;
}
.project {
position: absolute;
top: 30px;
left: 30px;
border-radius: 5px;
width: 240px;
height: 34px;
...
1
голос
Принятый
Как растянуть div по ширине до конца страницы? (html css)
1.Можно добавить flex:1; диву #content, это разрешит элементу увеличиваться по ширине
#content{
min-height: calc(100vh - 70px);
flex:1;
}
В шаблоне startpage.html оставь только нужное, ...
0
голосов
Как сжимать flex-элементы при адаптиве с flex-wrap
Конечно, ответ с вариантом использования grid куда более элегантный и, пожалуй, даже более предпочтителен, но если всё же не желаем обходиться без flex, то можно попробовать вот так:
.catalog__row ...
1
голос
Как сжимать flex-элементы при адаптиве с flex-wrap
Если можете, воспользуйтесь grid:
.catalog
{
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
gap: 30px;
}
.product
{
min-height: 50px;
border: 1px solid red;
}
<div class="...
1
голос
Принятый
Использование css переменных
Точно не знаю с чем это связано, по calc() не может выполнить вычисление из-за того, что значения не числа, а px.
Самый простой способ пофиксить - убрать px из переменных в :root
:root {
--figma-...
1
голос
Принятый
Межблочные отступы и отступы от краев экрана
flex-basis (или третья цифра в свойстве flex) не учитывает отступы в этом же блоке. Просто отнимаете отступы, и всё будет как надо. Или не пытайтесь добавлять отступы в обертке, а добавляйте в ...
1
голос
Как разместить элементы внутри блока на одинаковом расстоянии
Вариант на Flexbox
Для того, чтобы элементы выстраивались слева-направо, нужно использовать justify-content: flex-start; при flex-direction: row или align-items: flex-start; при flex-direction: column;...
1
голос
Как разместить элементы внутри блока на одинаковом расстоянии
Думаю тут лучше подойдёт grid-template-columns
grid | MDN
grid-template-columns | MDN
.list {
display: grid;
grid-template-columns: repeat(auto-fill,minmax(110px,1fr));
/* Расстояние ...
0
голосов
Как растянуть элементы контейнера на всю страницу?
*{
margin: 0;
padding: 0;
text-decoration: none;
}
body{
background: url(img/main-bg.png);
background-repeat: repeat;
}
.header{
display: flex;
align-items: center;
...
50 лучших ответов включены
Связанные метки
flexbox × 785css × 689
html × 483
css3 × 160
вёрстка × 128
html5 × 71
адаптивная-верстка × 28
javascript × 25
bootstrap × 25
grid × 19
css-grid × 19
position × 12
internet-explorer × 11
веб-программирование × 10
выравнивание × 9
jquery × 8
reactjs × 8
scss × 8
bootstrap4 × 8
layout × 8
float × 7
responsive × 7
width × 7
safari × 6
media-queries × 6