Проблемы с позиционированием

Когда я увеличиваю и уменьшаю масштаб, серый цвет моего фона проходит по красной рамке. Как остановить это?Проблемы с позиционированием

Мой CSS:

body { 
    font-family:Verdana, Arial, Helvetica, sans-serif; 
    font-size:12px; 
    color:#fff; 
    padding-top:30px; 
    margin: auto; 
    position:relative; 
    height:2055px; 
    border: 1px solid red; 
    width:1050px; 
    background-color: #090909; 
    margin-top:15px; 
} 
.backgroound { 
    position:relative; 
    top:-50px; 
    /* this gray goes over red border */ 
    background-color: gray; 
    height:1950px; 
    border: 1px solid gray; 
    width:985px; 
} 
.paa { 
    background-color:black; 
    font-size:40px; 
    position:relative; 
    border: 1px solid gray; 
    padding: 0px; 
    text-align:center; 
    height:80px; 
    margin-top:-30px; 
}

И мой HTML:

<header class="paa"> <a href="#"> 
    <img src="" alt="loggo"> 
</a> 
</header> 
<nav> 
    <ul> 
     <li> 
      <a class="vari" href="" id="home"><span >Home</span></a> 
     </li> 
     <li> 
      <a class="vari" href="" id="m">llls</a> 
     </li> 
    </ul> 
</nav> 
<div class="backgroound"></div>

источник

2015-09-02 waleedd32

С одной стороны, у вас есть недопустимый HTML и CSS. Комментарии CSS могут быть только стиля '/ * comment * /', вы не можете иметь двойную косую черту ('//'). Вам не хватает закрывающего тега '' вашего первого элемента привязки: ' loggo ' нуждается в закрывающем якоре после ''. Кроме того, ваш код является неполным. Включите все содержимое вашего HTML-файла, если вы когда-либо не уверены. Таким образом, люди могут увидеть, были ли сделаны какие-либо действительно простые ошибки, которые могут привести к недействительности вашего HTML. – UltraSonja

Мне нравится, как редактор подтвердил ваши CSS и HTML lol – UltraSonja

благодарю вас за ответ, поскольку я сказал, что я начинаю, и я забыл, что мы не можем комментировать css с двойной косой чертой. этот неизвестный друг (Housamz) решил мою проблему. спасибо вам – waleedd32

Так что вам нужно серый DIV быть в центре красной границы? , если это так, добавьте следующую строку:

.background 
    margin:auto; 
}

Проверить эту скрипку: https://jsfiddle.net/x3uc9qm5

источник

2015-09-02 16:18:02 housamz

его все еще не работает, если вы видите нижний серый цвет идет по красной границе – waleedd32

вам нужно уменьшить изображение, тогда вы увидите его – waleedd32

Теперь я получил его, изменив поля для «body» & «.background» следующим образом: margin: auto auto 10px – housamz

Вы должны сократить высоту .backgroound.

Либо:

height: 1830px;

или

height: 87%;

Fiddle: http://jsfiddle.net/ryanpcmcquen/1q52w0jf/

источник

2015-09-02 16:24:25 ryanpcmcquen

здесь не мой полный код, но когда я поставил высоту: 87%; все равно он проходит через красную границу ,,, здесь есть чат-система, если я могу отправить вам – waleedd32

Вам нужно будет предоставить полный код, он работает в моем примере до 25% увеличения. – ryanpcmcquen

Проблемы с позиционированием

ответ

Смежные вопросы