Значение свойства CSS height не учитывается при использовании элемента переполнения

0

Я использую css в div для отображения трех блоков на одной странице. Горизонтальная прокрутка может быть скрыта, а вертикальная прокрутка включена. Ниже приведен код для этой цели, но высота 100px, заданная для каждого div, не рассматривается браузером. Ниже мой код: Title1

  <body>
    <div>
      <div id="div1" style="float: left; width: 355px; height = 100px; border:thin solid black; overflow-y:scroll; overflow-x:hidden; ">
        1111111111111111111 <br>
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br>
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br>
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br>
      </div>

      <div id="div2" style="float: left; width: 605px; height = 100px; border:thin solid black; overflow-y:scroll; overflow-x:hidden; ">
        1111111111111111111 <br>
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br>
      </div>

      <div id="div3" style="float: left; width: 360px; height = 100px; border:thin solid black; overflow-y:scroll; overflow-x:hidden; ">
        <div id="div4">
          1111111111111111111 <br>
          1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 
          1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br>
        </div>
      </div>

      <br style="clear: left;" />
    </div>

</html>

Помогите мне решить эту проблему с высотой.

Благодаря Jagadesh S

Теги:
overflow

1 ответ

1

Вы используете height = 100px; , Это неправильный синтаксис. Он должен быть height: 100px; ,

<html>
  <head>
    <title> Title1 </title>
  </head>

  <body>
    <div>
      <div id="div1" style="float: left; width: 355px; height: 100px; border:thin solid black; overflow-y:scroll; overflow-x:hidden; ">
        1111111111111111111 <br>
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br>
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br>
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br>
      </div>

      <div id="div2" style="float: left; width: 605px; height: 100px; border:thin solid black; overflow-y:scroll; overflow-x:hidden; ">
        1111111111111111111 <br>
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 
        1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br>
      </div>

      <div id="div3" style="float: left; width: 360px; height: 100px; border:thin solid black; overflow-y:scroll; overflow-x:hidden; ">
        <div id="div4">
          1111111111111111111 <br>
          1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 
          1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br> 1 <br>
        </div>
      </div>

      <br style="clear: left;" />
    </div>

</html>

Ещё вопросы

Сообщество Overcoder
Наверх
Меню