raphael перемещает содержимое div вниз

-1

Наверное, супер-основной вопрос, но почему текст на первом div таблицы падает, когда raphael создает свою бумагу?raphael перемещает содержимое div вниз

<!DOCTYPE HTML> 
 
<html> 
 
    \t <head> 
 
    \t \t <script type="text/javascript" src="../js/jquery-1.8.3.js"></script> 
 
    \t \t <script type="text/javascript" src="../js/raphael-min.js"></script> 
 
    \t \t <script type="text/javascript"> 
 
\t \t \t $(document).ready(function() { 
 
\t \t \t \t raph = new Raphael('canvas_container', 600, 600); 
 
\t \t \t }); 
 
    \t \t </script> 
 
    \t \t <title>Simple JS Page</title> 
 
    \t </head> 
 
    \t <body> 
 
    \t \t <br> 
 
\t \t <div style="width: 100%; display: table;"> 
 
\t \t  <div style="display: table-row"> 
 
         <div id="text_container" style="height:600px;width:300px;border: 8px solid #f7f7f7;display:table-cell;-webkit-border-radius:8px;-moz-border-radius:8px;border-radius:8px;vertical-align:text-top;"> 
 
\t \t \t  why am I in the bottom??? 
 
\t  \t \t </div> 
 
\t  \t \t <div id="separator" style="height:600px;width:10px;display:table-cell"> 
 
\t  \t \t </div> 
 
\t  \t \t <div id="canvas_container" style="height:600px;width:600px;border: 8px solid #f7f7f7;display: table-cell;-webkit-border-radius:8px;-moz-border-radius:8px;border-radius:8px;"> 
 
\t  \t \t </div> 
 
\t \t \t </div> 
 
\t \t </div> 
 
\t </body> 
 
</html>

источник

2014-10-20 Jose Ospina

Сочинение в верхнем левом углу для меня. – Ian

Я предполагаю, что этот фрагмент кода не имеет доступа к jquery или raphael. Чтобы увидеть поведение, которое я вижу, вам нужно исправить пути этих двух библиотек и выполнить локально. –

Все табличного-имитационной КСС мешая. Похоже, вы пытаетесь создать два вертикальных divs, один шириной 300px, другой шириной 600px, с разделителем 10px. То же самое можно сделать с помощью плавания, и он играет немного лучше с Рафаэлем.

#text_container, #separator, #canvas_container{ 
    float: left; 
}

Fiddle: http://jsfiddle.net/q0aka3s6/

источник

2014-10-31 22:51:02 Scott

raphael перемещает содержимое div вниз

ответ

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