Pomoc przy divach

witam. Przeszukałem już kilka kursów jak tworzyc strony na divach jednak opieraja się one na bardzo prostych szablonach wiec nie znalazlem tam tego czego szukalem. Wiec tak, mam taki design. na zdjeciu jest (http://picasaweb.google.pl/lh/photo/t3nXrUjSWXAJO9WzWxODSg?feat=directlink) zaznaczony jest pociety szablon. Przy takim pocieciu potrzebuje aby ciecie 14 rozwijalo sie razem z 13 (14 jest cieniem). Poza tym numer 4 ma się rozciagac 100% w szerokosci. (z tym sobie poradzilem jako tlo o ustalonej pozycji w glownym divie)

Próbowałem to zrobić tak: podzielilem moj design na 3divy:

• pierwszy wzdłuż pionu 01 ciecia
• drugi wzdłuż pionu 02 ciecia
• trzeci wzdłuż pionu 03 ciecia.

W 02 byla cala strona a 01 i 03 mialy sluzyc tylko do rozciagania ciecia 14 i 15 wzdług zawartosci contentu (13). nie potrafiłem jednak uzaleznic 14,15 od content (13). Moje pytanie: czy da się to zrobić? Czy może przyjąć całkiem inna budowę tego szablonu?? (moze macie jakis pomysl bo ja wymiekam juz ...musze zrobic tak aby ten content caly zachodzil na menu i to mi utrudnia cala sprawe)

Troche inne pytanie: czy robiac szablon na divach mozna uzywac tabelek? czy powinno sie wszystko wpisywac w stylesheet a sam kod html ma zawierac tylko strukture divow??

Jezeli jest to banalne pytanie to sorki ale wczesniej robilem tylko strony na tabelkach ale zdecydowalem sie nauczyc robic wedlug standardow :)Sorki ze nie wrzucilem kodu jaki zrobilem ale skasowalem go rano myslac ze sie nie przyda bo byl bledny....

Mówienie "cięcie layoutu na divach" jest mylące i prawdopodobnie również Ciebie wprowadziło w błąd. Nie chodzi o to, by używać tylko elementów div. Tak naprawdę divów powinno być jak najmniej -- ich użycie powinno być ostatecznością. Zawsze powinieneś szukać bardziej semantycznych, tj. znaczących elementów. Powinieneś się zastanowić: czym jest ten fragment strony? Może nagłówkiem (użyj h1...h6)? Może listą jakichś elementów (użyj ul, gdy lista jest nieuporządkowana). Może zbiorem par klucz-wartość, przy czym jedna wartość może mieć wiele kluczy (wtedy użyj dl). A może ten element przechowuje dane kontaktowe (użyj address). Dopiero jak nie da się wymyślić innego, bardziej precyzyjnego elementu -- używaj elementów ogólnych: div (dla bloków zawartości) lub span (dla zawartości wierszowej).

W praktyce jednak HTML 4.01 jest tak ubogi składniowo, że rzeczywiście często trzeba używać divów.

Tyle że w Twoim wypadku np. menu to bardzo wyraźna lista elementów -- lista linków. Więc powinieneś użyć tam elementu ul (unordered list), wewnątrz którego powinieneś wstawić elementy li (list item), a dopiero wewnątrz każdego li łącze (element a) do danej podstrony.

I tak, nie powinieneś używać tabelek do robienia layoutu strony. Możesz używać tabelek, jeśli na stronie masz... tabelkę. Tj. dane tabelaryczne. Przykładowo, strona może zawierać jakiś cennik usług. Jeśli ma on postać tabelki (tj. z powodzeniem mógłbyś go wstawić powiedzmy do Excela i byłoby to logiczne), to wtedy użyj właśnie tabeli. Jednak tabele nie służą do tego, by wstawiać w nie obrazki np. z zaokrąglonymi rogami, tworząc fikuśne boksy.

Co do budowy szablonu, to tak, możesz przyjąć inną. Pamiętaj proszę, że w nowoczesnej (ta... istniejącej i powszechnie dostępnej już od 10 lat) technice robienia stron, podstawą jest warstwowe umieszczenie elementów. Ja na 99% nie tworzyłbym kawałków 14 i 15 tylko po to, by otaczały 13. Nie. Możesz zrobić zamiast 14 i 15 jeden element, umieszczony a w środku niego ("nad nim") umieścić 13. Tak samo 01 i 03 są bez sensu. Bo teraz masz na równi 01, 02 i 03. A zrób element 01 i w środku niego umieść 02, zostawiając po bokach trochę miejsca (używając np. własności padding na 01), by tło z 01 mogło po bokach prześwitywać.

Dzięki za odpowiedź. Jednak nadal muszę się zapytać jak zrobić aby (juz dobrze pociete) 14 rozciagalo sie razem z 13 (to samo tyczy sie 15)??

Przecież Ci napisałem. Nie dziel strony w ten sposób. Nie rób 14 i 15. Zrób jedno 14 na całą szerokość strony, a dopiero wewnątrz 14 wstaw 13. Sytuacja analogiczna do tej w nagłówku.

Kumasz? Zrób jeden tzw. pojemnik (ang. container, wrapper) tak szeroki, by obejmować obszary od 14 do 15. W środku tego szerokiego pojemnika wstaw element 13, zostawiając po bokach odpowiednią ilość miejsca (taką, jaką miałyby kolumny 14 i 15). Następnie w tle pojemnika umieść taki szeroki obrazek: po lewej stronie umieść fragment, który byłby kolumną 14, a po prawej ten, który miałby być kolumną 15.

Ugh, chyba czas na ASCII art:

|--------------------|
|  |--------------|  |
|  |              |  |
|14|      13      |15|
|  |              |  |
|  |--------------|  |
|--------------------|

^^to są 2 elementy, jeden w drugim. Ten zewnętrzny (symulujący 14 i 15, choć jest tylko jednym elementem) będzie się rozciągał tak jak ten wewnętrzny (czyli 13)

ok dzieki