Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> Kolorowa tabelka <table> czy <div> [html/css]
Axadiw
post
Post #1





Grupa: Zarejestrowani
Postów: 29
Pomógł: 0
Dołączył: 13.03.2005

Ostrzeżenie: (0%)
-----


Witam,

Zarówno dziś, jak i wczoraj zawracałem głowę paru osobom na irc-u, jak przerobić jedną z moich ramek opartych na tabelach, na "ramkę na div-ach" (za chwilę przykład (IMG:http://forum.php.pl/style_emoticons/default/snitch.gif) )

Otóż:
aktualnie tabelka wygląda tak:
http://mir3.9o.pl/katalog/table.php

połączona z 9 elementów, 1,3,7, i 9 to rogi ramki, a 2,4,6 i 8 to fragmenty rozciągające się wraz z przyrostem tekstu w samym środku(5 element w gwoli ścisłości)

Całość sprawuję się całkiem dobrze, poza wyjątkami gdy niektóre fragmenty są przycinane (ramka ta to część większego layoutu, więc jest podawana extremalnym próbom ściskania i rozciągania (IMG:http://forum.php.pl/style_emoticons/default/smile.gif) )

Poza tym wiem, ze strony oparte na tabelkach są gorzej indeksowane przez wyszukiwarki niż te oparte na div-ach

Tak więc zabrałem się do przerabiania ramek na divy (dla ułatwienia eksperymentuje jak widzicie tylko na jednej, oderwanej od reszty, stąd to tło poza brzegami).

Wyniki pracy tutaj: http://mir3.9o.pl/katalog/div.php

Dostałem parę rad od ludzi z irca, a także poradników parę (pare sam znalazłem):
http://kalsey.com/2003/07/rounded_corners_in_css/
http://tutorials.alsacreations.com/cadre/
http://www.sitepoint.com/article/css-round...rs-boxes-curves

lecz opierają się one na innej budowie ramki, niż moja wcześniejsza:
a to dlatego, że są to jednolite ramki, wypełnione kolorem, a ich budowa jest następująca:

4 rogi, w jednym divie, a reszta wypełniona kolorem(odnosząc się do tutoriala z kashley.com)
Co do górnej i dolnej części ramki dostałem podpowiedź, ze można by pociąć od nowa tą tabelkę, i stworzyć obrazek jednego z rogów o wymiarach np 1000x20, a następnie nakładając jeden na drugi, co stworzy jedną całość.

Po pierwsze: po co tworzyć niepotrzebnie (!) tak wielki obrazek(niepotrzebnie zajmuje zbyt dużo miejsca), po drugie, a co jak tabelka będzie miała tekstu na 1500px? to tylko pośrednie rozwiązanie.

Po drugie: jak skleić środkową część tabelki? (jak widzicie na http://mir3.9o.pl/katalog/div.php, udało mi sie połączyć prawy róg, ale co z lewym? jak dam tam <img> to tekst wskakuje akapit niżej, poza tym jak ustalić, aby ten <img> się rozszerzał?)

To jedno rozwiązanie, próbowałem także z właściwościami float i clear:
wszystkie elementy tablicy miały float:left (a po każdych 3 był <br>)
Wyniki tej pracy tutaj: http://mir3.9o.pl/katalog/div_float.php

Wszystko fajnie, ale po wpisaniu tekstu w środek ramka się rozjeżdża. Nie potrafię ustalić zależności między ilością tekstu w elemencie nr 5, a szerokością/wysokością elementów 2,4,6,8.

Jakby mi ktoś uświadomił jak zapisać w css-ie jak zrobić tą tabelkę, tak tak aby była widoczna pod FF/IE/Opera i żeby była dobrze indeksowana byłbym wdzięczny (IMG:http://forum.php.pl/style_emoticons/default/smile.gif)
Go to the top of the page
+Quote Post
 
Start new topic
Odpowiedzi
Axadiw
post
Post #2





Grupa: Zarejestrowani
Postów: 29
Pomógł: 0
Dołączył: 13.03.2005

Ostrzeżenie: (0%)
-----


no nie wiem ze ten przykład jest w FAQ nawet, ale to nie jest rozszerzająca się tabela! ma z góry ustaloną wysokość i nie zmienia się w zależności od zawartości.

Wydaje mi sie ze nie obędize się tutaj bez <table>, moze niektorych rzeczy nie da sie osiągnąc samym css-em
Go to the top of the page
+Quote Post

Posty w temacie


Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Aktualny czas: 22.08.2025 - 20:50