Zmienna szerokość komórki w tabeli, Problem Opcje

[ArekKrol]

Witam. Nie wiem jak to nazwać dlatego ciężko mi poszukać odpowiedzi na forum. Chodzi mi o to aby strona zawsze była wyświetlana w całym oknie przeglądarki, przy czym:
mam dwie kolumny (lewą i prawą) ze stałymi rozmiarami, chcę aby środkowa była ruchoma ... ale miała minimalną szerokość np. 400px. Chodzi o to że przy oglądaniu stronki na rozdzielczości 800x600 lub 1024x768 strona będzie na całym oknie ... tylko środkowa część strony/tabeli będzie się rozsuwać lub zsuwać w zależności od potrzeb. A dopiero przy rozdzielczości mniejszej niż 800x600 pojawią się poziome paski przewijania. Wiecie jak to nazwać? Albo jeszcze lepiej - jak to zrobić? Pozdrawiam

[drPayton]

[HTML] pobierz, plaintext 
<table id="Kontener" style="width:100%;background:yellow;">
	<tr>
		<td id="lewaKolumna" style="height:50px;width:200px;background:red;"></td>
		<td id="srodkowaKolumna" style="background:green;"></td>
		<td id="prawaKolumna" style="width:200px;background:blue;"></td>
	</tr>
</table>
[HTML] pobierz, plaintext 

Jeżeli komuś uda się to zrobić na DIV'ach (tak by działało i pod FF i pod badzIEwiem), niech się pochwali.
Co do minimalnej szerokości - nie ma chyba nic takiego w html/css co działałoby i pod FF i pod IE, javascriptem da się to zrobić prosto...

[Cezar708]

[HTML] pobierz, plaintext 
<div style='width: 100%'>
  <div id='lewa' style='float: left; width: 400px; background: rgb(255,0,0) 1px;'>
     lewa
  </div>
  <div id='srodek' style='float: left; background: rgb(0,255,0) 1px;'>
     srodek 
  </div>
  <div id='prawa' style='float: right; width: 400px; background: rgb(0,0,255) 1px;'>
     prawa
  </div>
</div>
[HTML] pobierz, plaintext 

oczywiście kolorki żebyś widział jak to wygląda w praktyce. Problem się pojawi przy rozdziałce niskiej (strona się rozejdzie) sprawdź sobie

EDIT: nie testowałem na innych przeglądarkach więc nie wiem

Ten post edytował Cezar708 2.08.2007, 15:22:20

[drPayton]

Uhm, ale środek nie zajmuje całej szerokości, co będzie problemem np w przypadku obramowania... Dlatego napisałem na tabelach

Ten post edytował drPayton 2.08.2007, 15:27:15

[Cezar708]

@drPayton... ano też można:

[HTML] pobierz, plaintext 
<div style='width: 100%'>
  <div id='lewa' style='float: left; width: 400px; background: rgb(255,0,0) 1px;'>
     lewa
  </div>
  <div id='prawa' style='float: right; width: 400px; background: rgb(0,0,255) 1px;'>
     prawa
  </div>
  <div id='srodek' style='margin-right:400px; margin-left:400px; background: rgb(0,255,0) 1px;'>
     srodek 
  </div>
</div>
[HTML] pobierz, plaintext 

(zwróć uwagę na kolejność DIVów)

[drPayton]

A teraz zobacz co się stanie, kiedy zmniejszysz okno przeglądarki (IMG:http://forum.php.pl/style_emoticons/default/tongue.gif)
Czyli nadal źle... ;-)

Ten post edytował drPayton 2.08.2007, 15:58:42

[ArekKrol]

drPayton, mówisz, że w javie da się to zrobić. Możesz podpowiedzieć jak?

Przepraszam (IMG:http://forum.php.pl/style_emoticons/default/winksmiley.jpg)

Ten post edytował ArekKrol 2.08.2007, 19:23:19

[drPayton]

@ArekKrol: Proponuje kopiuj-wklej nicka, wtedy błędu nie będzie :roll2:
Załóżmy,że jednak na div'ie robimy, i ten div (środkowy) ma id="srodek", a minimalna szerokość to 400px:

[HTML] pobierz, plaintext 
<script type="text/javascript">
function pilnuj_szerokosci()
{
    if(document.getElementById("srodek").style.width < 400)
        document.getElementById("srodek").style.width = 400;
}
</script>
[HTML] pobierz, plaintext 

I ta funkcja musi być wywoływana na zakończenie ładowania strony. I weź przykład (jeśli divy) z pierwszego tu posta @Cezar708

Ten post edytował drPayton 2.08.2007, 18:02:49

[Cezar708]

A teraz zobacz co się stanie, kiedy zmniejszysz okno przeglądarki (IMG:http://forum.php.pl/style_emoticons/default/tongue.gif)
Czyli nadal źle... ;-)

no nie da rady, jeśli nie zrobisz takiej kontroli w JS co do szerokości to jeśli szerokość okna będzie za mała (czyli w moim przypadku mniejsza niż 400+400=800px) i zakładając że w środkowej kolumnie nic nie ma to strona się rozjedzie...

ja zamiast kontroli środkowej kolumny zrobiłbym w javaScript kontrolę rozdzielczości całego ekranu i na podstawie tego określiłbym szerokość wszystkich DIVów, w szczególności tego div - rodzica (co w moim przypadku ma szerokość 100%).