warstwy zamiast tabel Opcje

[slash.]

mam takie pytanie w jaki sposob mozna uzyskac za pomoca warstw efekt taki jak dostawalem przy uzyciu tabel i tla komorki, czyli do tej pory uzywalem czegos takiego:

[HTML] pobierz, plaintext 
<table>
<tr>
<td bgcolor="#000000" width="1"></td>
<td>
Tekst<br />
test<br />
</td>
<td bgcolor="#000000" width="1"></td>
</tr>
</table>
[HTML] pobierz, plaintext 

chodzi mi o to ze niewazne ile tekstu bym wpisal w srodkowa kolumne to boczne beda sie rozcialaly tworzac obok pionowe czarne kreski, teraz w jaki sposob moge osiagnac podobny efekt przy uzyciu warstw i CSS

[revyag]

Kod

<style type="text/css">
#main{
    width:200px;
    background-color:black;
}
#bord{
    margin-left:1px;
    margin-right:1px;
    background-color:white
}
#cont{
    margin-left:2px;
}
</style>

[HTML] pobierz, plaintext 
<div id="main">
    <div id="bord">
        <div id="cont">
            Tekst<br />
            test<br />
        </div>
    </div>
</div>
[HTML] pobierz, plaintext 

[slash.]

a tak juz z innej paczki - zastanawia mnie czy mozna zbudowac strone zupelnie bez uzycia tabel Chodzi mi o to czy taki serwis jak php.pl czy to forum mozna zbudowac bez uzycia ani jednej tabelki - no moze bez ani jednej to nie - bo z tego co sie orientuje aby wsyrodkowac zawartosc tak aby byla wysrodkowana zarowno w IE jak i netscape trzeba uzyc tabelki, ale czy mozna zbudowac strone ograniczajac znacznie liczbę tabel - powiedzmy do tego stopnia zeby zostala tylko ta jedna wysrodkowujaca calosc

[bregovic]

Oczywiście że można - a nawet należy. Tabele są najbardziej gwałconym tagiem w całym htmlu. żeby wyśrodkować warstwe w css piszesz:

Kod

#warstwa {margin: auto;}

[slash.]

zgadza sie ale to nie zawsze we wszystkich przegladarkach dziala, dobra to moze kolejne pytanie z tej serii, powyzej pytalem jak zrobic na warstwach krawedzie tak jak za pomoca tabeli, a teraz mam pytanie jak zrobic cos takiego:
mam tabele ktora sklada sie z dwoch kolumn lewa to zawartosc z jakims tekstem a prawa to kolumna ktora posiada szerokosc powiedzmy 20px i tlo jako jakis gif, na gore kolumny ma byc umieszczony plik rog_gora.gif a na dole rog_dol.gif na tabelach mniej wiecej by to tak wygladalo:

[HTML] pobierz, plaintext 
<table width="400" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td rowspan="2"><p>ad</p>
    <p>asd</p>
    <p>asd</p>
    <p>asd</p></td>
    <td width="20" background="bg.gif" valign="top"><img src="rog_dol.gif" width="20" height="12" /></td>
  </tr>
  <tr>
    <td background="bg.gif" valign="bottom"><img src="rog_dol.gif" width="20" height="12" /></td>
  </tr>
</table>
[HTML] pobierz, plaintext 

i w jaki sposob moge osiagnac cos takiego przy pomocy warstw

Kolejne pytanie - w jaki sposob umiescic obok siebie dwie warstwy, do tej pory stosowalem cos takiego:

[HTML] pobierz, plaintext 
<div style="position:relative; width:400px; height:200px; border:1px;; border-color:#000000">
	<div style=" position:absolute; top:0px; left:0px; width:150px; height:200px; border:1px; border-color:#000000">Warstwa nr 1 </div>
	<div style=" position:absolute; top:0px; left:150px; width:250px; height:200px; border:1px; border-color:#000000">Warstwa nr 2 </div>
</div>
[HTML] pobierz, plaintext 

jednak mam tutaj na sztywno okreslone pozycje jak i rozmiary warsty, co by bylo jezeli chcialbym zeby zarowno warstaw 1 jak i warstwa 2 byly jednakowej wysokosci ale nie okreslonej na sztywno, tylko zaleznej powiedzmy od ilosci tekstu w warstwie 1 - ta bedzie sie dopoasowywala gdy tylko usune parametr height jednak warstwa 2 bedzie bez zmian.
Jak to mozna zrobic w ten sposob ktory chce

No i trzecie pytanie - gdzie w sieci znajde jakis dobry manual, kurs lub cos w tym stylu dotyczacy CSS i warstw

Z gory dzieki za pomoc

[Denver]

Oczywiście że można - a nawet należy. Tabele są najbardziej gwałconym tagiem w całym htmlu. żeby wyśrodkować warstwe w css piszesz:

Kod

#warstwa {margin: auto;}

IE wymaga jeszcze text-align: center

Do slasha:
http://glish.com/css/

[revyag]

Co do pierwszegp pytania, to nie wiem, czy dokładnie coś takiego można uzyskać, ale polecam odwiedzenie strony http://csscreator.com/version2/pagelayout.php
wprawdzie generuje to layouty dla całej strony, ale nic nie stoi na przeszkodzie żeby po drobnych modyfikacjach użyć wygenerowanego layouta w inny sposób
Natomiast jeśli chodzi o umiejscowienie warstw obok siebie, to można np. tak:

Kod

<style type="text/css">
#w1,#w2,#w3{
    width:100px;
    background-color:red;
    display:inline;
}
#w2,#w3{
    background-color:green;
    margin-left:5px;
}
#w3{
    background-color:blue;
}

[HTML] pobierz, plaintext 
<div id="w1">Lorem ipsum</div>
<div id="w2">dolor sit amet</div>
<div id="w3">consectetur adipisicing elit</div>
[HTML] pobierz, plaintext 

Żeby było widać, że warstwy są obok siebie dałem im różne kolory.