Странная позиция в блоке inline-block без холста (см. Пример) - PullRequest
Новая
       0

Странная позиция в блоке inline-block без холста (см. Пример)

0 голосов
/ 20 декабря 2011

См. http://log85.no -ip.org / q100.html

Почему второй блок находится в этой позиции? // в Firefox и Chrome

Ответы [ 3 ]

0 голосов
/ 20 декабря 2011

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

<!DOCTYPE HTML>
<html>
   <head>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
      <title>[ LoG85 ] - [ Duda CSS ]</title>
      <style type="text/css">
         body {background:#012;text-align:center}
         .container {width:800px;margin:auto;border:1px solid blue}
         .block {display:inline-block;border:1px solid green;width:320px;height:240px}
      </style>
   </head>
   <body>
      <div class="container">

         <div class="block"></div>        I removed <canvas></canvas> from here.
         <div class="block"></div>
         <div class="block"><canvas></canvas></div>
         <div class="block"><canvas></canvas></div>
         <div class="block"><canvas></canvas></div>
         <div class="block"><canvas></canvas></div>
      </div>
   </body>
</html>

Примечание: я не тестировал его в Chrome, так как у меня не установлен Chrome, но он работает нормальнов IE и Firefox.

0 голосов
/ 20 декабря 2011

Вы пытались добавить этот CSS: 

canvas{display:block;width:100px;height:100px;}

Обновление: это только потому, что холст имеет размер по умолчанию, превышающий ожидаемый в этом случае, который вызывает странную, но "нормальную" реакцию HTML.

С уважением,

0 голосов
/ 20 декабря 2011

Имеет отношение к ширине и высоте холста по умолчанию.Если вы установите их на 100%, это решит проблему.

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

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

...