@timtimIT

Почему для некоторых блоков css правила для маленьких экранов,срабатывают на всех экранах?

Добрый день. Подскажите,почему для некоторых блоков css правила для маленьких экранов,срабатывают на всех экранах? Есть два типа блоков, обоим задан маргин слева при экранах меньших чем 668px, так для одних блоков работает все корректно,а для других срабатывает и на больших экранах...

<div class="main-right-block ">
						      <img src="static/images/snake.png" alt="picture"/>
							  <h5><a href="#">The Bite That Heals</a><span   class="blockstars"><a href="#"><span class="stars"></span></a><a href="#"><span class="stars"></span></a><a href="#"><span class="stars"></span></a><a href="#"><span class="stars"></span></a><a href="#"><span class="stars"></span></a></span></h5>
					          <span class="time">6 days ago</span><span class="votes">71,482 votes</span>
						  </div>


                                                 <div class="video">
							     <a href="#"><img src="static/images/parrot.png" alt="picture"/></a>
						  </div>


.main-right-block{
width:223px;
border-style:solid;
border-width:1px;
border-color:#eeeeee;

padding:4px;
padding-top:3px;
margin-bottom:17px;
overflow:hidden;
}

.main-right-block h5{
font-size:12px;}

.main-right-block a{
text-decoration:none;
color:#777777;}

.main-right-block .votes{
padding-right:0px;}

.video{
width:223px;
margin-bottom:6px;
margin-left:0px ;

border-style:solid;
border-width:1px;
border-color:#eeeeee;

padding:5px;
padding-top:3px;
overflow:hidden;}

@media  ( max-width: 668px ) {

               .main-right-block{
		 margin-left:15%;}
		
		
		
		.video{
		margin-left:15%;}
}


Не правильно работает для класса video.
  • Вопрос задан
  • 222 просмотра
Пригласить эксперта
Ответы на вопрос 1
rockysoul
@rockysoul
ruby monkey
Чаще всего это проблема в селекторе. Второй недостаточно точный чтобы перекрыть первый.
Если у вас есть mobile-first селектор .someclass .someotherclass div.target
А вы для больших экранов делает просто селектор
div.target, то он не сработает. Попробуйте дописать к нему !important чтобы проверить.

А вообще код не помешал бы конечно.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы