Границы <BODY>и <DIV>смещаются при изменении размера. Как мне исправить? - PullRequest
Новая
       32

Границы <BODY>и <DIV>смещаются при изменении размера. Как мне исправить?

0 голосов
/ 22 февраля 2012

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

вот так это выглядит: Границысмещение http://img819.imageshack.us/img819/1893/aproblem.png

Я был бы рад, если бы вы могли предложить решение ...

Не знаю, что его вызывает.

Обратите внимание, пожалуйста, не меняйте обертку,потому что это действительно единственный макет, который работал для моего сайта ... Но я думаю, что можно изменить заголовок и ногу, или, возможно, добавить еще несколько оберток, если бы я только знал, где.

Спасибо!

Вот код: 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<style>
body{
border:3px solid #FFAD17;
background-color:#FFF;
border-radius:7px;
font:9.5pt Tahoma;
margin:0px;
padding:0px;
}
html {
margin:0px;
padding:0px;
}

div.header{
    background-image:url('http://img804.imageshack.us/img804/4743/testcj.png');
    background-position:top;
    background-size:100% 100%;
    background-repeat:repeat-x;
    padding: 3px;
    }
div.wrapper{
    float:left;
    }
div.context_wrapper{
    margin-left:158px;
    padding: 3px;   
    }
div.context{
    float:left;
    }
div.menu{
    text-align:center;
    padding: 3px;
    width:140px;
    float:left;     
    }
div.footer{
    background-image:url('http://img198.imageshack.us/img198/9422/test2fy.png');
    background-position:bottom;
    background-size:100% 100%;
    background-repeat:repeat-x;
    width:auto;
    padding: 3px;
    clear:both;     
    }
</style>
</head>

<body>
<div class="header">Head</div>
<div class="wrapper">
    <div class="menu">Menu</div>
    <div class="context_wrapper">
        <div class="context">
            ContentContentContentContentContentContentContentContentContentContentContentContentContentContentContentContentContentContent
        </div>
    </div>
</div>
<div class="footer">Foot</div>
</body>

</html>

1 Ответ

0 голосов
/ 22 февраля 2012

Вышеуказанное прекрасно работает на моем компьютере.Однако, если вы столкнулись с этой проблемой при изменении размера, попробуйте применить min-width к элементу div, содержащему фон, и повторите попытку.

...