blednie rysowana tabelka Opcje

[one_eddie]

Obrazek prezentuje problem. To co jest u gory wyswietlana jest przez FireFoxa, wersja 1.0.6. Jak widac znacznie rozni sie od tego wyswietlanego w IE.

Problem polega na tym ze nie wiem co powoduje bledne wyswietlanie tabeli.

Kod XHTML:

Kod

<table class="inputTable" cellpadding="0" cellspacing="0">
  <tr>
     <td>
    <p>Wprowadz dowolna fraze:<br/><input type="text" name="search" size="100" maxlength="500" /></p>
     </td>
     <td width="70px">
    <p><br/><input type="submit" name="a" value="Szukaj" accesskey="S"></p>
     </td>
  </tr>
  <tr>
     <td>
    <p><a class="searchTabLink" href="szukaj.php" title="Kliknij aby zobaczyc zaawansowane opcje wyszukiwania...">Zaawansowane wyszukiwanie</a>&nbsp;&nbsp;<a class="searchTabLink" href="pomoc.php" title="Kliknij aby zobaczyc pomoc...">Jak szukac?</a></p>
     </td>
     <td>
    <p>&nbsp;</p>
     </td>
  </tr>
</table>

CSS:
.inputTable {
    padding-left: 5px;
    padding-right: 5px;
    width: 100%;
}
a.searchTabLink:link, a.searchTabLink:visited, a.searchTabLink:hover {
    color: #999999;
    text-decoration: underline;
    font-size:  8pt;
}

Czy istnieje jakis sposob aby wraz ze zmiana rozmiaru okna zmieniac rozmiar input boxa (size a nie maxlength)?

[FiDO]

Bledne wyswietlanei tabeli powoduje inny box-model w IE. W IE mozna wlaczyc poprawny box-model (ale tylko w wersji 6) poprzez zdefiniowanie prawidlowego DOCTYPE'a dla XHTML'a ale bez prologu XML'owego.

Polecam lekture np tego: http://css.maxdesign.com.au/listamatic/about-boxmodel.htm

[one_eddie]

Wielkie dzieki za linka naprawde dal mi do myslenia, ale mam mala prosbe o ktora czesc "doctype stringa" chodzi jesli pisza o: "XHTML 1.0 Transitional - missing Prolog"?

W jakim aktualnie starndardzie najlepiej tworzyc strony zeby nie bylo takich zonkow z boxami (tabelke z konca artykolu widzialem, pytam o twoje doswiadczenie)?

Pozatym dziwna sprawa skoro mam full doctype XHTMl 1.0 to wg tabelki moj IE 6 powinien byc w trybie quirks i zle narysowac tabele, a jest przeciwnie. IE sobie radzi ale inne nie (sprawdzalem na operze, FF - widac to co na zaloczonym obrazku - gornym)

Ten post edytował one_eddie 14.09.2005, 00:35:10

[FiDO]

Wielkie dzieki za linka naprawde dal mi do myslenia, ale mam mala prosbe o ktora czesc "doctype stringa" chodzi jesli pisza o: "XHTML 1.0 Transitional - missing Prolog"?

Np. tutaj masz co nieco o docytpach: http://www.alistapart.com/stories/doctype/
missing Prolog oznacza, ze nie mozesz umieszczac na poczatku prologu XML'owego bo sie wlacza quirksmode, poszukaj sobie tematu o prologu, byl tutaj nie tak dawno, tam tez napisalem cos o tym.

W jakim aktualnie starndardzie najlepiej tworzyc strony zeby nie bylo takich zonkow z boxami (tabelke z konca artykolu widzialem, pytam o twoje doswiadczenie)?

Zalezy w co celujesz.. jesli w zgodnosc ze mozliwie duza iloscia przegladarek to jest kiepska sprawa, bo IE5/5.5 nie wspiera standardowego box-modelu bez wzgledu na doctype, wiec juz odpadaja w przedbiegach. Mozna oczywiscie stosowac hacki (ktorych nie brakuje w sieci.. google -> ie box model hacks i znajdziesz tego na peczki), ale to moze sie okazac bardzo zlym pomyslem za jakis czas (polecam 4 news na www.quirksmode.org ). Sa sposoby na obchodzenie tego problemu bez hackow, ale wiaze sie to z wielokrotnym zagniezdzaniem w sobie elementow HTML'a, co z kolei eleganckie nie jest. Tak wiec nie ma jakiegos zlotego rozwiazania, z czegos trzeba zrezygnowac. Wybor nalezy do Ciebie
Pozatym rzadko wszystko musi byc pixel-perfect i czesto takie roznice mozna zignorowac, bo strony z tego powodu nie roznia sie wiele (chyba, ze stosujesz duze wartosci dla marginow czy borderow) i mozna to najzwyczajniej w swiecie olac, bo pytajac osobe trzecia, ktora sie nie zna o to czy widzi roznice, odpowie ze nie.

Pozatym dziwna sprawa skoro mam full doctype XHTMl 1.0 to wg tabelki moj IE 6 powinien byc w trybie quirks i zle narysowac tabele, a jest przeciwnie. IE sobie radzi ale inne nie (sprawdzalem na operze, FF - widac to co na zaloczonym obrazku - gornym)

Nie nie.. raczej jest odwrotnie .. inne sobie radza a IE nie (gorna tabelka z obrazka jest poprawna)
FF zawsze stosuje poprawny box-model (zgodny z W3C), chyba ze mu wskazesz jawnie w stylach inaczej (za pomoca moz-box-sizing). FF tez ma swoje standards mode i quirks mode, ale nie wplywaja one na interpretacje box-model. Opera tez nie jest inna i ma swoje tryby. Ona juz w trybie quirks emuluje box-model "zgodny" z IE (niezgodny z W3C), ale w trybie standardow wyswietla zgodnie ze standardami.
Rzuce jeszcze troche linkami, zebys mial co czytac
http://www.opera.com/docs/specs/doctype/ - doctype switching dla Opery.. jest tam tez link u samej gory do tego samego dla FF i IE. Na tej stronie i tych z linkow do FF i IE opisane jest co sie rozni w tych trybach i jak je aktywowac w danej przegladarce.
http://hsivonen.iki.fi/doctype/ - a tutaj tabelka zbiorcza dla kilku przegladarek

Milej lektury.. zmeczylem sie tym pisaniem, na dzisiaj koniec

[one_eddie]

patrzac na moj XHTML nie bardzo zgodze sie z tym iz FF, opera, dobrze rysuja zawartosc. Piszac kod wyobrażałem sobie to co zrobil IE.

Przeczytałem juz prawie wszystkie teksty ktore mi podeslales i linki prowadzace do innych , zawarte w nich. Jeszcze raz dzieki za linki.

Zacząłem testowac: usunąłem prolog, nic sie nie zmienilo w IE i FF, czyli dalej jest blad. Ale bardzo zdziwil mnie fakt, kiedy usunąlem doctypa. nagle wszystko jest jak należy.

Zostawilem samo

Kod

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">

Wymiękłem w tym momencie. DOCTYPE = NONE oznacza ze kazda jest w Quirku, ale co najważniejsze zawartosc rysuje sie tak jak bym sobie tego życzyl

// edit:
Czy to oznacza ze zle zbudowalem swoj kod? bo chcialbym zeby strona byla zgodna ze standartem no i zeby wyswietlala sie tak jak to widac na zalaczonym obrazku - dolnym.

Ktos podsunal mi pomysl zeby usunac odstepy tagu <p>, co spowoduje prawidlowe wyswietlenie w FF, probowalem ustawic <p style="padding: 0px"> lub <p style="margin: 0px"> ale caly czas jest to samo.

Rozumiem ze FF i inne wyswietlaja moja strone zgodnie ze standardem ktory ustawilem, ale bardzo chcial tym wiedziec jaki element tego standardu powoduje rozszezenie tej tabeli?

Ten post edytował one_eddie 14.09.2005, 11:36:19

[FiDO]

patrzac na moj XHTML nie bardzo zgodze sie z tym iz FF, opera, dobrze rysuja zawartosc. Piszac kod wyobrażałem sobie to co zrobil IE.

No to przykro mi, ale Twoje wyobrazenie nie bylo zgodne ze standartami W3C.

Czy to oznacza ze zle zbudowalem swoj kod? bo chcialbym zeby strona byla zgodna ze standartem no i zeby wyswietlala sie tak jak to widac na zalaczonym obrazku - dolnym.

http://willow.iie.uz.zgora.pl/~ipatalas/de.../box-model.html
http://willow.iie.uz.zgora.pl/~ipatalas/de...del-prolog.html

Porownaj sobie to na IE6, FF i Operze (pliki roznia sie tylko prologiem).
Jesli chcesz, zeby sie to wyswietlalo tak jak na dolnym obrazku, ale w zgodzie ze standartami, to musisz zmnieszyc szerokosc tej tabelki, poniewaz w standardzie podajac width podajesz szerokosc zawartosci elementu, a nie calosci razem z borderem i paddingiem.

Rozumiem ze FF i inne wyswietlaja moja strone zgodnie ze standardem ktory ustawilem, ale bardzo chcial tym wiedziec jaki element tego standardu powoduje rozszezenie tej tabeli?

Na to odpowiedzialem juz wyzej.. i jest to opisane w pierwszym linku jaki tutaj dalem oraz oczywiscie w specyfikacji W3C.

[one_eddie]

Problem zazegnany faktycznie, wszystko tkwilo w blednym kodzie XHTML. Poprawilem pare znacznikow <p>, dodalem kilka styli i wszystko jest tak jak nalezy.

Dzieki za pomoc, teraz lepiej rozumiem temat box modeli.