Почему блок form вылезает за страницу, а input за form?

Question

[PO6OT]

Почему блок form вылезает за страницу, а input за form (form вылезает за страницу, когда ширина страницы становится меньше его max-width)?
Как исправить?
box-sizing: border-box не помогает

Сайт - fixpc.tk, внизу форма, смотрите F12, а то рамки у формы нет

Answer 1

[IceJOKER]

form {
	width: 100%;
	max-width: 540px;
        /*...*/
}
.input {
	display: block;
	margin: 8px;
	padding: 9px;
	width: 100%;
}
/*100% = 540px, прибавляем еще по 9px padding и получаем = 558px*/

нужно указать ширину - width: 522px; для содержимого form(input, textarea..)

p.s. и вы собираетесь заниматься услугами создания сайтов????!!!!!! СНАЧАЛА НАУЧИТЕСЬ САМИ!

Для резиновой верстки:

.input {
	display: block;
	margin: 8px;
	padding: 9px 2%;
	width: 96%;
}

Comments

[PO6OT]

понятно, что надо указать ширину
но это костыль, при чём на маленьких устройствах input будет вылезать за form, a form за страницу

[IceJOKER]

Вадим Егоров: не делайте вид, что понимаете! если хотите резиновый сайт, так укажите значения свойств резиновые, а не фиксированные!

[PO6OT]

IceJOKER: так у меня не фиксированные, у меня max-width, а не width, то есть при достижении определённого размера экрана форма растянута на весь блок .block (за исключением padding'ов).
box-sizing: border-box должен изменить алгоритм расчета width так, чтобы учитывались отступы, но этого не происходит
я надеюсь вы знаете что это

[IceJOKER]

Вадим Егоров: box-sizing только заметил, но вы не учли, что margin он не считает

[PO6OT]

всё-равно это костыль
никаких процентов!

[IceJOKER]

Вадим Егоров: ну вам лучше знать

[PO6OT]

IceJOKER: я как-то замечал, что при display: block некоторые блоки растягиваются на всю ширину родителя, учитывая margin и padding

[PO6OT]

IceJOKER: где вы у меня margin увидели?

[IceJOKER]

Вадим Егоров: зайдите в стили и посмотрите! дальше уже сами разбирайтесь со своей проблемой, я вам указал на причину! нет желания дальше вести дискуссию с вами

[PO6OT]

IceJOKER: исправил проблему - убрал лишние margin