Блок рейтинг фильмов не встает под предыдущий(новости), что делать?

0

Что делать в этом случае

html
css

2 ответов

0

<div class="site_content">
<div class="sitebar_container">
<div class="sitebar">
<div class="sitebar">
<h2>Поиск<h2>
<form method="post" action="a" id="search_form">
<input type="search" name="search_field" placeholder="ваш запрос"/>
<input type="submit" class="btn" value="найти"/>

</form>
</div>

</div>
<div class="sitebar">
<h2>Вход</h2>
<form method="post" action="a" id="login">
<input type="text" name="login_field" placeholder="логин"/>
<input type="password" name="password_field" placeholder="пароль"/>
<input type="submit" class="btn" value="войти"/>
<div class="lables_passreg_text">
<span><a href="#">забыли пароль?</a></span> | <span><a href="#">регистрация</a></span>
</div>
</form>
</div>

<div class="sitebar">
<h2>Новости</h2>
<span>06.07.2020</span>
<p>Мы запустили расширенный поиск</p>
<a href="#">читать</a>
</div>

</div>


<div class="sitebar">
<h2>Рейтинг фильмов</h2>
<ul>
<li><a href="#">Форсаж</a><span class="rating_sitebar">8.1</span></li>
<li><a href="#">Марвел</a><span class="rating_sitebar">9.2</span></li>
<li><a href="#">Легенда</a><span class="rating_sitebar">8.4</span></li>
<li><a href="#">Привет,Джули</a><span class="rating_sitebar">8.7</span></li>

</ul>
</div>

</div>
</div>
</div>

body{
font-size: 1em;
background-color: #fff;
color:teal;
}

p{
padding:0 0 20px 0;
line-height:1.6em;

}

input[type="text"], input[type="password"], input[type='search']{
color:teal;
width:75%;
padding:8px;

}
input, textarea{
outline:none;
border:none;
border:solid 1px teal;


}


h1,h2{
font:normal 100% 'centry gothic',Imprint MT Shadow;
margin:0 0 5px 0;
padding:2px 0 2px 0;
color:teal;
}
h2{
font-size:150%;
color:indigo;

}

a,a:hover{
outline:none;
text-decoration:underline;
color:indigo;

}

ul{
margin:2px 0 22px 17px;

}

ul li{
margin: 0 0 6px 0;
padding: 0 0 4px 5px;
line-height:1.5em;

}
.header {
background-color:teal;
height: 177px;
font-size: 0.8em;
margin-right: 0px;
margin-left: 0px;
min-width: 900px;

}


.main, .logo, .menubar, .site_content, .footer {
margin-right: auto;
margin-left: auto;

}

.logo {
width: 880px;
padding-bottom: 40px;
}
.logo h1, .logo h2{
font:normal 300% 'century gothic', arial, sans-serif;
margin:0 0 0 9px;
}
.logo_text h1, .logo_text h1 a, .logo_text h1 a:hover{
padding:22px 0 0 0 ;
color:indigo;
letter-spacing:0.1em;
text-decorating:none;
}
.logo_text h2{
font-size:1.2em;
padding:4px 0 0 0;
color:#222;
}
.menubar{
width:900px;
height:100px;


}
ul.menu{
float:left;

}
ul.menu li{
float:left;
padding:0 0 0 9px;
list-style:none;
margin:1px 2px 0 0;
}
ul.menu li a{
font-size:1.4em;
display:block;
height:20px;
padding:6px 35px 5px 28px;
color:navy;
text-decoration:white;
}
ul.menu li.selected a{
color:lightblue;
}
ul.menu li a:hover{
color:pink;

}
.site_content{
width:880px;
overflow:hidden;
margin:20px auto 0 auto;
background-color:white;

}
.sitebar_container{
float:left;
width:224px;
}
.sitebar{
float:left;
width:140px;
padding:5%;
margin:0 0 16px 0;
border:solid 1px teal;
border-radius:5px;
background-color:007;
}
.btn{
padding:8px;
background-color:white;
cursor:pointer;

}

.sitebar h2{
color:indigo;
}
.lables_passreg_text{
font-size:0.9em;
margin-top:3%;
margin-left:2%;
}
.sitebar ul{
margin:0;
float:left;
}
.sitebar ul li{
list-style-type:none;
margin:0 0 0 ;
float:left;
}
.sitebar .rating_sitebar{
float:right;
}

0

Покажите код целиком, html и css, помогу найти ошибку.

Sign up or Log in to write an answer