[html]Problem z tabelą pod IE7, pod Operą i FF jest ok...

yagiel · Post autor: **yagiel** » pt lip 06, 2007 1:21 pm

Witam! Jestem tutaj nowy i niedawno zacząłem się interesować webdesignem. Wcześniej zajmowałem się tylko grafiką, więc z góry przepraszam za brak profesjonalizmu. Na pewnej stronce przeczytalem że layout najlepiej przyłożyć w postaci tabeli. Czytając to forum dochodze coraz bardziej do wniosku że powinno się to robić na divach, jednak póki co mój pierwszy layout chciałem przełożyć w postaci tabeli, a później spróbuję z divami jeśli dam rade sie tego nauczyć. Mój problem polega na tym, że gdy zrobiłem tabelę, której kod jest poniżej i połączyłem ze sobą kilka wierszy i kolumn, mam problem z ustaleniem ich wysokości na stałe. Pod FF i operą wszystko gra, jednak ie zachowuje się co najmniej dziwnie. Chciałem żeby komórka w której aktualnie jest napis header miała 120 px wysokości i zaraz pod nią zaczynała się komórka body która będzie zajmowała tyle ile pozostanie po odjęciu wartości wszystkich ustalonych komórek od 627 (wysokość całej tabeli). Niestety pod IE header ma dużo ponad 120 przez co body jest malutkie.Pod operą i FF nie ma tego problemu. Jak można to naprawić? Proszę o pomoc, dla mnie to dość ważne, a niedługo wyjeżdżam. Z góry dziękuję. Oto kody:
HTML

Kod: Zaznacz cały

<html>
<head>
<title>Untitled Document</title>
<link rel="stylesheet" href="styl.css" />
</head>
<body>

<table width="742"  height="627" border="0" cellspacing="0" cellpadding="0" align="center" class="glowna">
  
    <tr>
<TD colspan="4" height="58" class="top">
<img src="images/layout3_03.png"></TD>
  </tr>
  
  <tr>
    <td rowspan="6" width="27" class="left"></td>
    <td rowspan="3" width="196" height="410" class="menu"><img src="images/layout3_06.png">
	<FORM method="post" action="skrypt.php3">
	<p>Miejscowosc:</p><p><INPUT type="text" name="miejsc" size="18"></p>
	<p>Ilosc osób w pokoju:</p>
	<p><select name:"pokoje" size="1">
	<option value="1">1</option>
	<option value="2">2</option>
	<option value="3">Wiecej</option></select></p>
	<p>Standard:</p>
	<p><select name:"stan" size="1">
	<option value="bez">Brak okreslonego</option>
	<option value="1g">1 gwiazdkowy</option>
	<option value="2g">2 gwiazdkowy</option>
	<option value="3g">Lepszy</option></select></p>
	<p>Cena:</p>
	<p>Od <INPUT type="text" name="cena1" size="3"> 
	do 
	  <INPUT type="text" name="cena2" size="3"></p>
	<p><input type="submit" value="Szukaj!"></p></FORM>
	</td>
    <td height="3"  width="494" class="up"></td>
    <td rowspan="6" width="25" class="right"><img src="images/layout3_08.png"></td>
  </tr>
  <tr height="120">
    <td width="494" class="hdr">header</td>
  </tr>
  <tr>
    <td rowspan="2" width="494"  class="body">body
    </td>
  </tr>
  <tr>
    <td height="108" class="body"><img src="images/layout3_40.png"></td>

  </tr>
  <tr>
    <td colspan="2" height="19" class="body"><img src="images/layout3_43.png" align="middle"></td>
  </tr>
  <tr>
    <td colspan="2" height="19"class="down"></td>
  </tr>
</table>

</body>
</html>

CSS:

Kod: Zaznacz cały

/* CSS Document */
html, body	   { background-image:url(back.gif);padding:0px;  margin: 5 px 5 px 5 px; } 
/*Marginesy*/

p {margin: 0 px 5 px 0 px 0 px; color:fff; font-family:tahoma; font-size:13px }

/*Polozenie*/
table.glowna {
/*background-image: url(images/layout3_25.gif);*/
padding-top: 0px;
width: 742px;
border-width: 0px;
display: block;
margin-left: auto;
margin-right: auto;
margin-top: 0px;
margin-bottom: 0px;
}

td.top {
height: 58 px;
border-width: 0px;
padding: 0px;
margin: 0px;
vertical-align: top;
}

td.left {
width: 27px;
height: 569 px;
border-width: 0px;
padding: 0px;
margin: 0px;
vertical-align: top;
margin-top: 10px;
background-image:url(images/layout3_05.png);
}

td.right {
width: 25px;
height: 569 px;
border-width: 0px;
padding: 0px;
margin: 0px;
vertical-align: top;
margin-top: 10px;
background-image:url(images/layout3_08.png);
}

td.menu {
width: 196px;
/*height:360px;*/
border-width: 0px;
padding: 0px;
margin: 0px;
vertical-align: top;
background-image:url(images/layout3_17.png);
}

td.menu p{
margin:0px;
margin-top:3px;
vertical-align: top;
padding: 1px;
padding-left:15px;
}

td.up {
height:3px;
border-width: 0px;
padding: 0px;
margin: 0px;
vertical-align: top;
margin-top: 10px;
background-image:url(images/layout3_07.png);
}

td.hdr {
height:120px;
border-width: 0px;
padding: 0px;
margin: 0px;
vertical-align: top;
background-image:url(images/layout3_24.png);
}

td.body {
border-width: 0px;
padding: 0px;
margin: 0px;
vertical-align: top;
padding:0;
background-image:url(images/layout3_24.png);
}

td.down {
border-width: 0px;
padding: 0px;
margin: 0px;
vertical-align: top;
background-image:url(images/layout3_45.png);
}

td.ftr_menu {
border-width: 0px;
padding: 0px;
margin: 0px;
vertical-align: top;
background-image:url(images/layout3_40.png);
background-repeat:no-repeat;
}

PS. W przyszłości będę chciał do tego dodać mechanizm szukania w php. Czy tabela jest odpowiednim schematem strony do tego przedsięwzięcia? Czy może lepiej zastosować divy? Wszystkie rady będą mi bardzo pomocne.

Tabasco · Post autor: **Tabasco** » pt lip 06, 2007 5:39 pm

Witam

Moim zdaniem o wiele lepiej zastosować div'y. Wiadomo łatwiej wszystko ustawić na stronie tak jakby sie chciało a poza tym kiedyś jak używałem php na tabelii to strona mi sie sypała. Ale wiadomo to tylko moje skromne zdanie.

Pozdrawiam

yagiel · Post autor: **yagiel** » pt lip 06, 2007 8:06 pm

a ktoś zna może rozwiązanie tego mojego problemu? Bo postanowiłem że divów się tez naucze, ale ta strone potrzebuje dosc szybko skonczyc i przerobienie chyba zajmie dosc duzo czasu.

[html]Problem z tabelą pod IE7, pod Operą i FF jest ok...

[html]Problem z tabelą pod IE7, pod Operą i FF jest ok...

Re: [html]Problem z tabelą pod IE7, pod Operą i FF jest ok...

Re: [html]Problem z tabelą pod IE7, pod Operą i FF jest ok...