Добавляю в tbody div, стили не работают. В чем может быть дело?
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=UTF-8'/>
<style>
table
{
width: *;
height: 20em;
border: 1 px solid red;
}
div.banner
{
opacity:0.8;
background-color:threedshadow;
width:3em;
height:3em;
border-radius:6px;
}
</style>
<script type="text/tiscript">
function insert()
{
var el = new Element("div");
el.@#class = "banner";
el.@#style = "";
self.$(table).$(tbody).append(el);
}
self#insert.onClick = insert;
</script>
</head>
<body>
<table>
<tbody/>
</table>
<widget #insert type="button">Insert banner</button>
</body>
</html>
Здравствуйте, c-smile, Вы писали:
CS>Здравствуйте, Walker_Tula, Вы писали:
CS>В твоем примере стили работают.
В моем примере у баннера заданы размеры:
width:3em;
height:3em;
Но почему-то он после вставки не обращает внимания на них.
Хочется, чтобы было так:
На картинке пример, где вместо tbody использую body. А нужно, чтобы работало и для tbody.
Здравствуйте, Walker_Tula, Вы писали:
W_T>В моем примере у баннера заданы размеры:
W_T>W_T> width:3em;
W_T> height:3em;
W_T>
W_T>Но почему-то он после вставки не обращает внимания на них.
Ну начать с того что по стандарту таблицы могут содержать срого ограниченный набор элементов.
Здесь вот например
http://www.w3.org/TR/html401/struct/tables.html#h-11.2.3 написано что tbody
может содержать только TR.
Я расширил этот набор но тем не менее table layout manager продолжает работать с этими элементами
как с rows/cells/sections/captions.
Например таблица заполняет весь свой внутренний объем ячейками. Что ты и наблюдаешь.
Вставляй <td> а в неё уже этот <div>.
