| Шацкий Денис | 12.01.2011 15:01 |
Вот как-то так хотелось бы....И ещё надо так чтобы блоки left и right были равны по высоте блоку main.
Позиционирование в FireFox
Здравствуйте! При разметке страницы через CSS возникла проблема с FireFox'ом. Задумка была такая: есть три div-блока на странице - left, right и main. Блоки left и right растягиваются по вертикале относительно блока main. Всё это работает в IE и отказывается работать в ff: width: 100% работает относительно окна браузера, а не блока main.
В HTML:
html>
<head>
<title><? include('title.php'); ?></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="default.css">
</head><? include('background.php');?>
<div id="main">
<div id="left">
</div>
<div id="right">
</div>
<!-- Прелоадер -->
<script type="text/javascript" language="JavaScript">
<!--//--><![CDATA[//><!--
if (document.images) {
var img = new Object();
img["first"] = new Image(200, 210);
img["first"].src = "btn.tng";
img["second"] = new Image(200, 210);
img["second"].src = "btna.png";
// и так далее...
}
//--><!]]>
</SCRIPT>
<?
include ('browser.php');
?>
<font size=5 color="purple"><b><p align="center">
<?
include('stih.php');
?>
</p></b>
font color="black" size=3><b><p align=center>
<?
include('fl.php');
?>
</p></b>
</font>
</div>
</body>
В CSS-файле:
#left{
position: releative;
width:150px;
float:left;
height:100%;
background:url(r1.png);
}
#right{
position: releative;
width:150px;
float:right;
height:100%;
background:url(r1.png);
}
#main{
width:auto;
height:100%;
width:auto;
}
html, body {
height: 100%;
width:100%;
font-family:Arial, Helvetica, sans-serif;
cursor: url(cur.cur), auto;
}
a:link,
a:visited,
a:active{
color: red;
cursor: url(cur.cur), auto;
}
a:hover{
cursor: url(cur.cur), auto;
}
table, img, form {
border:0;
}
object, img, a{
outline: none;
cursor: url(cur.cur), auto;
}
A {
text-decoration: none;
}
Заранее спасибо! :) |
делай в таблице и не IP себе мозг, не понимаю тех кто создаёт таблицы блоками если есть таблицы.
|
Цитата:
|
Также этот вариант не работает в Опере
|
Шацкий Денис, сделай нормальный хтмл-пример... Или картинкой нарисуй чего хочешь...
|
Вот как-то так хотелось бы....И ещё надо так чтобы блоки left и right были равны по высоте блоку main. |
Цитата:
|
Цитата:
|
Шацкий Денис, это:
- не запустить прямо тут - не скопипастить в файл хтмл - не чистый хтмл Так понятно? Я ведь не выкладываю тут примеры кода на csp... |
Теперь хоть картинку я увидал... :)
Какие размеры по ширине у Лефт, Райт и Майн? |
Цитата:
http://www.xiper.net/collect/html-an...oy-visoty.html |
Цитата:
|
Цитата:
<!DOCTYPE html>
<head>
<style>
* {
margin: 0;
padding: 0;
}
#container1 {
background-color: orange;
}
#left {
float: left;
width: 150px;
}
#container2 {
margin-left: 150px;
background-color: yellow;
}
#right {
float: right;
width: 150px;
}
#main {
margin-right: 150px;
background-color: silver;
}
.end {
clear: both;
}
</style>
</head>
<body>
<div id='container1'>
<div id='left'>
<p>Left</p>
<div class='end'></div>
</div>
<div id='container2'>
<div id='right'>
<p>Right</p>
<div class='end'></div>
</div>
<div id='main'>
<p>Main</p>
<div class='end'></div>
</div>
<div class='end'></div>
</div>
<div class='end'></div>
</div>
</body>
</html>
Но в ИЕ7 не работает... :-E |
Цитата:
|
Цитата:
|
ппц а таблицы зачем придуманы?
|
Skipp, желательно уметь пользоваться всем ассортиментом - так проще выбрать желаемое... ;)
|
Цитата:
|
Шацкий Денис, одно другому не мешает... ;)
|
ksa, в принципе да. Особенно если учесть, что разница между браузерами очень велика :) . Так что плюнул я на это дела и сделал разметку табличкой ;)
|
Цитата:
Вообще-то логичнее, если хочешь сделать велосипед, сделать велосипед, а не коляску. |
| Часовой пояс GMT +3, время: 14:37. |