Где я допустил ошибку в верстке?

Question

[Martyer]

имеется tpl

<wrapper>
<header>
<logo><a href="/"><img src="{THEME}/images/logo.png" alt="Смотреть онлайн мультфильмы" /></a></logo>
<social><a href="https://vk.com/" target="_blank"><img src="{THEME}/images/me-vk.png" alt="Мы Вконтакте" style="  padding-left: 2px;"/></a><br><img src="{THEME}/images/favorite_add.png" style=" margin-top: 3px; "> <a href="#" onclick="return addFavorite(this);" style="vertical-align: super;  color: red;">Добавьте в закладки</a></social>
<search>{include file="searcht.tpl"}</search>
</header>
       
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery('#mycarousel').jcarousel({
// Configuration goes here
});
});
</script>
       
<ul id="mycarousel" class="jcarousel-list jcarousel-list-horizontal jcarousel-skin-tango" style="width: 100%;margin: 0 auto;" >
           
</ul>
       
<sidebar>
{include file="sidebar.tpl"} 
</sidebar>
</wrapper>

и css

/*BODY*/
html, body {
margin:0px; 
padding:0px;
height:100%;
background: url(../images/background.png);
font-family: Tahoma;
font-size: 12px;
}
wraper {
width:75%;
}

/*HEADER*/
header {
width: 75%;
margin: 0 auto;
height: 65px;
background: #3ec5fd;
border-bottom-left-radius: 25px;
border-bottom-right-radius: 25px;
}
logo, search {
float: left;
width: 33%;
}
social {
float: left;
width: 33%;
padding-top: 10px;
}
header::after {
content: "";
display: block;
clear: both;
}

шаблон сюда кинул тыц, wrapper не обволакивает. Раньше было такое с body, что позже повлекло проблемы.. да и выровнять трудно будет. Может знает кто в чём ошибка состоит?

Comments

[Александр Хрол]

Чем не обволакивается? Что Вы хотите получить на выходе?

Answer 1

[Евгений Петров]

А кто это — wrapper?
Если используете самопальные имена тэгов, то напишите хотя бы display для него. Типа такого:

wrapper {
	display: block;
}

Comments

[Martyer]

Спасибо за помощь, я новичок, теперь буду знать)