Browser Scroll отключает контент - PullRequest
Новая
       6

Browser Scroll отключает контент

4 голосов
/ 09 октября 2010

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

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

http://www.artworknotavailable.com/examples/cutoff.html

Я что-то здесь упускаю? 

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Browser Cutoff Example</title>
    </head>

    <body>

    <div>
      <div style="background-color:#009900;">
        <div style="width:800px;">
          <strong>Width: 800px </strong>

          <br />
          Resize your browser Smaller than the width of this box until Horizontal scroll bars appear
          <br />
          Now scroll to the right. 
          <br />
          Why is the box getting cut off?
        </div>
      </div>
    </div>


    </body>

    </html>

Ответы [ 2 ]

3 голосов
/ 29 сентября 2012

Эта проблема тоже свела меня с ума, и на самом деле ее очень просто решить.Просто добавьте свойство min-width и укажите то же значение, что и ширина вашего сайта (800px, 960px, ..)

1 голос
/ 09 октября 2010

У вас есть 3 вложенных div. один не в стиле. следующий в имеет цвет фона. и он самый глубокий, имеет ширину 800 пикселей.

попробуйте это, и вы увидите, что происходит: 

<html xmlns="http://www.w3.org/1999/xhtml"><head>


<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<title>Browser Cutoff Example</title>
</head><body>

<div>
    <div style="background-color: rgb(0, 153, 0); border: 9px solid blue;">
    <div style="width: 800px; border: 1px solid red;">
        <strong>Width: 800px </strong>
        <br>
        Resize your browser Smaller than the width of this box until Horizontal scroll bars appear
      <br>
      Now scroll to the right. 
      <br>
      Why is the box getting cut off?
    </div>
  </div>
</div>


</body></html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...