Помогите с блоком ввода по макету


#1

Не понимаю как сделать как в макете. Поле для ввода с кнопкой слишком большие, но если убирать падинги, то слетает позиционирование.

https://codepen.io/STRL7/pen/EOrJyj мой код этого блока
http://joxi.ru/vAWV8Z6s17vjK2 как в макете

и еще я нечаянно создал такую же тему во вкладке “Знакомство” удалите пожалуйста


#2

Можно сделать так: https://codepen.io/IneSSka/pen/pQYWLE


#3

Спасибо, в следующем блоке возникли проблемы с сектором “Связаться со мной” не понимаю как придать такой вид. И еще вопрос что бы блоки ввода располагались так это justify-content: column?


#4

Свойства с таким значением нет. Покажите свой следующий сектор. Я не понимаю, о чем вы просите.


#5

ой, забыл скинуть скрин
flex-direction: column: я про это говорил перепутал
http://joxi.ru/l2Z3q6aiw00nzA
код которой сейчас https://codepen.io/STRL7/pen/VVNZzx


#6

Ваши блоки experience и contacts располагаются таким образом за счет flex-direction: row по умолчанию у about-us-wrap.


#7

ок, а что делать со списком как сделать что бы он позиционировался от правого края?


#8

Проще всего разметить таблицей, и текст в ячейках первого столбца выровнять по правому краю.


#9

Можете еще объяснить пару моментов?
2 встроенных отступа у первых блоков таблицы и заголовка: Заголовок: http://joxi.ru/V2VG7KQCx10VzA
Таблица: http://joxi.ru/bmoBKVZIx6Movr

код: извините что он такой большой просто там сразу несколько блоков https://codepen.io/STRL7/pen/ZmNQvV


#10

А что с этими отступами не так? В чем проблема?


#11

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


#12

А, я поняла. Это внешние отступы по умолчанию. Их нужно обнулять или переопределять на необходимые.


#13

Оно находиться в body и я изначально задал обнуление для этого блока, вот и не понимаю почему они есть


#14

Вы не поняли. Отступы по умолчанию сверху и снизу есть у каждого заголовка. (а также у многих других текстовых тегов)


#15
h2 {
margin: 0;
padding: 0;

}

если это делать так, то ничего не поменялось


#16

И еще вот в этой форме не меняется цвет хотя он задан. Почему это может быть http://joxi.ru/Vm6kY7qTDBxbx2


#17

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


#18

Спасибо, line-height действительно был лишним хотя


#19

Вы задаете цвет для вводимого текста, а я так понимаю, что хотите стилизовать именно placeholder.


#20

Да, с этим наверно сам разберусь спасибо за наводку, но вот с таблицей все так же не пойму от куда отступы. Уже и высоту убрал стало лучше но не исчезло