CSS - problem z pozycjonowaniem - Grupy dyskusyjne w eGospodarka.pl

eGospodarka.pl › Grupy › pl.comp.www › CSS - problem z pozycjonowaniem › CSS - problem z pozycjonowaniem

Path: news-archive.icm.edu.pl!news.gazeta.pl!not-for-mail
From: "Zielony" <z...@p...pl>
Newsgroups: pl.comp.www
Subject: CSS - problem z pozycjonowaniem
Date: Mon, 26 Apr 2010 09:33:43 +0200
Organization: "Portal Gazeta.pl -> http://www.gazeta.pl"
Lines: 246
Message-ID: <hr3fkt$if8$1@inews.gazeta.pl>
NNTP-Posting-Host: hrg19.internetdsl.tpnet.pl
Mime-Version: 1.0
Content-Type: text/plain; format=flowed; charset="iso-8859-2"; reply-type=original
Content-Transfer-Encoding: 8bit
X-Trace: inews.gazeta.pl 1272267229 18920 79.188.188.19 (26 Apr 2010 07:33:49 GMT)
X-Complaints-To: u...@a...pl
NNTP-Posting-Date: Mon, 26 Apr 2010 07:33:49 +0000 (UTC)
X-MimeOLE: Produced By Microsoft MimeOLE V6.0.6002.18005
X-Priority: 3
X-Newsreader: Microsoft Windows Mail 6.0.6002.18005
X-User: zieleniutki
X-MSMail-Priority: Normal
Xref: news-archive.icm.edu.pl pl.comp.www:395637
[ ukryj nagłówki ]
Witam

Mam problem z okresleniem wysokosci diva.

Obrazek ilustrujacy problem:

http://img63.imageshack.us/img63/4798/59930056.jpg

Jak widac problem jest z wysokoscia #content_left i #content_right, ktore
ustawilem na sztywno. Jak zmusic te divy, aby dostosowywaly swoja wysokosc
do centralnego?

HTML:
<body>

<div id="container">

<div id="tab">
<div id="tab_left"></div>
<div id="tab_middle">
<p class="tab_text">Informacje</p>
</div>
<div id="tab_right"></div>
</div>

<div id="header">
<div id="header_top_left"></div>
<div id="header_top_right"></div>
<div id="header_top"></div>
</div>

<div id="content_left"></div>

<div id="content_right"></div>

<div id="content">
<p class="title_orig">2 Fast 2 Furious</p>
<br>
<br>
<table width="100%" cellpadding="4" cellspacing="0" id="info_table">
<tr>
<td id="td_info">Tytuł:</td>
<td>Szybcy i Wściekli 2: Za szybcy, za wściekli</td>
</tr>
<tr>
<td id="td_info">Kraj:</td>
<td>Niemcy, USA</td>
</tr>
<tr>
<td id="td_info">Rok produkcji:</td>
<td>2003</td>
</tr>
<tr>
<td id="td_info">Gatunek:</td>
<td>Akcja, Sensacyjny</td>
</tr>
</table>
<br>
<br>
<table width="100%" cellpadding="4" cellspacing="0" id="info_table">
<tr>
<td id="td_info">Nośnik:</td>
<td>1 DVD</td>
<td id="td_info">Data dodania:</td>
<td>2007-09-19</td>
</tr>
<tr>
<td id="td_info">Czas trwania:</td>
<td>107</td>
<td id="td_info">Obejrzany:</td>
<td>Tak</td>
</tr>
<tr>
<td id="td_info">Język polski:</td>
<td>Napisy, Lektor</td>
<td id="td_info">Pożyczony:</td>
<td>Nie</td>
</tr>
</table>
</div>

<div id="footer">
<div id="footer_left"></div>
<div id="footer_right"></div>
<div id="footer_middle"></div>
</div>

</div>

</body>

CSS:
body
{
background-color: #e9f1fa;
font-size: 11px;
font-family: Segoe UI, Tahoma, Verdana, Arial, sans-serif;
}

#container
{
width: 90%;
margin: 10px auto;
}

#content_left
{
float: left;
width: 10px;
height: 150px;
background-image: url(images/content_left.gif);
margin: 0px;
padding: 0px;
background-color: #FFFFFF;
}

#content_right
{
float: right;
width: 10px;
height: 150px;
background-image: url(images/content_right.gif);
margin: 0px;
padding: 0px;
clear: right;
}

#content
{
margin-left: 10px;
margin-right: 10px;
padding: 10px;
background-color: #FFFFFF;
}

.tab_text
{
font-weight: bold;
margin-top: 9px;
margin-left: 5px;
}

table td
{
border: 1px solid black;
}

table
{
border-collapse: collapse;
}

#header_top_left
{
float: left;
width: 10px;
height: 11px;
background-image: url(images/header_top_left.gif);
}

#header_top
{
height: 11px;
background-image: url(images/header_top.gif);
background-repeat: repeat-x;
margin-left: 10px;
margin-right: 10px;
}

#header_top_right
{
float: right;
width: 10px;
height: 11px;
background-image: url(images/header_top_right.gif);
}

#tab_left{
float: left;
width: 10px;
height: 29px;
background-image: url(images/tab_left.gif);
}

#tab_middle {
float: left;
width: 72px;
height: 29px;
background-image: url(images/tab_middle.gif);
}

#tab_right
{
height: 29px;
background-image: url(images/tab_right.gif);
margin-left: 82px;
background-repeat: no-repeat;
clear: right;
}

#footer_left
{
float: left;
width: 10px;
height: 11px;
background-image: url(images/footer_left.gif);
}

#footer_middle
{
height: 11px;
background-image: url(images/footer_middle.gif);
background-repeat: repeat-x;
margin-left: 10px;
margin-right: 10px;
}

#footer_right
{
float: right;
width: 10px;
height: 11px;
background-image: url(images/footer_right.gif);
}

#td_info
{
font-weight: bold;
background-color:#bfdbff;
width: 80px;
}

.title_orig
{
display: inline;
font-size: 15px;
font-weight: bold;
}

Dziekuje za przeczytanie i ewentualne odpowiedzi.

--
Zielony