← Комьюнити

Почему размер div для классов sidebar_conteiner и sidebar не соответствует значениям?

Владимир Валякин4 ответов
#html#css

div с классом "Sidebar_conteiner" имеет больший размер, чем с классом "Sidebar" однако на странице получилось наоборот. Я вставил свойство border для наглядности http://valyakin.ru/screens/screen1.png Почему так?

.sidebar_conteiner {
	border: solid 1px black;
	float: right;
	width: 224px;
}
.sidebar {
	float: right;
	width: 222px;
	padding: 5%;
	margin: 0 0 16px 0;
	border: solid 1px #f2f2f2;
	border-radius: 5px;
	background-color: #f9f9f9;
}

4 ответов

В html верстке класс задан точно такой .sidebar_conteiner? С ошибкой в слове container?

student_5X1YqLbg

да. имя классов одинаковое и в html и в css. В противном случае мы бы не увидели бордер. На самом деле если убрать свойство padding: 5%; то они станут равными. Но в описании свойства padding я не нашел, что оно способно увеличивать элемент.

Владимир Валякин

Как весь код выглядит?

student_cX4p_FA9

Такого фрагмента достаточно?

<div class="sidebar_conteiner">
				<div class="sidebar">
					<h2>Поиск</h2>
					<form method="post" action="#" id="search_form">
						<input type="search" name="search_field" placeholder="Ваш запрос" />
						<input type="submit" class="btn" value="найти" />
					</form>
				</div>
</div>
Владимир Валякин

Ваш ответ

Войдите, чтобы ответить