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

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

« poprzedni wątek

następny wątek »

Ilość wypowiedzi w tym wątku: 2

1. Data: 2010-04-26 07:33:43
Temat: CSS - problem z pozycjonowaniem
Od: "Zielony" <z...@p...pl>

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

[ pokaż wiadomość z nagłówkami ]

do góry
2. Data: 2010-04-26 10:53:55
Temat: Re: CSS - problem z pozycjonowaniem
Od: "Zielony" <z...@p...pl>

Użytkownik "Zielony" <z...@p...pl> napisał w wiadomości
news:hr3fkt$if8$1@inews.gazeta.pl...

<ciach>

Dla siebie i potomnych:

google -> 3 col layout CSS same height

--
Zielony

[ pokaż wiadomość z nagłówkami ]

do góry