[css]Div Opcje

[Kuziu]

Witam,

Na początek pytanie czy naprawde zaleca się stosowanie DIV'ów zamiast tabel ?

Drugie pytanie konkretnie o div'y

[HTML] pobierz, plaintext 
<div>
	<div style="float:left; display:inline; background-color:#009900;"><p style="margin:0px;">tekst</p></div>
	<div style="float:left; display:inline; background-color:#CC0000;"><p style="margin:0px;">drugi<br />asd</p></div>
</div>
[HTML] pobierz, plaintext 

Daje to efekt taki



Moje pytanie jak zrobić by lewy dostosowywał swą wysokość do prawego ?

Chodzi mi o to ze tekst w prawym będzie zmiennej długości i chciałbym aby lewy sie do niego dostosowaywał.

Gdy dam 100% to rozszerza się na całe okno =[

[hwao]

Musisz dac stopke z clear: both; czyli jakis element blokowy

Masz tutaj
http://css-discuss.incutio.com/

Layout'y 2 i 3 kolumnowe poprzegladaja jak to dziala.

[Kuziu]

Ehhhh

nie wiem czy to ma sens.

Pisanie CSSów długości 30-50 linii, do tego zamykanie diva w divie w nim nastepnego i jeszcze jednego tylko po to by uzyskać efekt taki jaki daje tabela.

Robicie tak czy na tabelach

[revyag]

@Kuziu
Kiedy pozycjonujesz jakiś element blokowy to nie nadajesz mu stylu display:inline, a potem float. Ten pierwszy spowoduje że element będzie się zachowywał jak czysty tekst i wtedy drugi jest zbędny.

Co do dylematów pisać w oparciu o tabelki czy nie to poczytaj sobie np.tu
http://www.alistapart.com/articles/journey/
http://osiolki.net/tabelki/

[ens0re]

Bo tabelki nie służa do robienia stron(a raczej układu stron) a do danych tabelarycznych. Natomiast dzieki divom(to jeden z przykładów tylko) powinno sie tworzyc strony. Jasne ze mozesz uzyc technik hybrydowych(tabele + css) do stworzenia serwisu, lecz to nie bedzie to samo co z samego CSSa z XHTMLem. Jaka róznica? Ano taka że tabele zżerają kb, przez co wolniej strony sie wczytuja itp.(jest o wiele wiecej powodów, ale to juz sam poszukaj). Porównaj sobie np kod:

[HTML] pobierz, plaintext 
<table><tr><td>Hello</td></tr></table>
[HTML] pobierz, plaintext 

i

[HTML] pobierz, plaintext 
<h1>Hello</h1>
[HTML] pobierz, plaintext 

Który kod zżera mniej kb? Oczywiście, że drugi. Do tego formatowanie tego w CSS.
Dyskusjii było wiele na ten temat i możesz poszukać na forum i w google.

[-Guest-]

A mi się wydaje że nie ma co się napalać i przechodzić na tworzenie stron tylko i wyłącznie opartych na div'ach, jestem zwolennikiem stosowania zarówno tabelek jak i div'ów. Wybór niech należy do webmastera

W tym tygodniu polecam:
Fotografia przyrodnicza

[hwao]

Strony na tabelkach narzucaja jakis wyglad strony, pozatym tabelki powstaly do przedstawiania danych tabelarnych a nie calej strony.

zobacz sobie strone css garden masz tam jeden ten sam kod xhtml i zmieniasz tylko sam styl a strony wygladaja zupelnie dowolnie!

jezeli nie chcesz isc do przodu ze standartami to mozesz pisac w tabelach... pozatym nie wiem skad u Ciebie wzielo sie tyle tego css'a jak tu wystarczy 10 linijek

[Kuziu]

Tak tak tylko na tej stronie jest stały wygląd strony a ja będę miał dynamicznie dodawane newsy.

Co powoduje rozciąganie...

Nie wiem czy stosowanie tego tricku z 20000px paddinga i marignesu na minusie jest dobrym wyjściem.

Czy to nie jest przejście z tabel na divy z którymi jak widać są problemy i trzeba się uciekać do sztuczek...
=[

[ens0re]

Może masz źle zaprojektowaną strone poprostu że Ci sie rozciaga. Trzeba na spokojnie od nowa napisac a nie na szybko wrzucic divy css i inne bajery zeby tylko miec na divach. IMO duzym bledem jest np jezeli masz strone na tabelkach i ta strone z tabelek chcesz przerobic odrazu na divy(chodzi w tym samym pliku). Wtedy najlepiej od zerowego pliku stworzyc kod od nowa, to bedziesz mial pewnosc, ze żadne pozostałości z tabelek nie beda zakłucać poprawnego działania strony. O standardach sieciowych możnaby dyskutować baaardzo długo...

[huntercs]

po 1: ktoś może zamnkąć otwierającą się stronę ze względu na szybkość jej ukazywania, chodzi tu oczywiście o kilogramy table,tr,td aby wogóle coś pokazać
po 2: strona na tabelach jest mniej 'profesjonalna'/wiarygodna, każdy przeciętny użytkownik komputera może odpalić sobie photoshopa, trochę fantazji i layout gotowy, pózniej tylko zapisz jako obrazki i html i strona gotowa!, no sorry
po 3: strona jest sztywna, tylko w takim układzie jakoś wygląda, użytkownicy np. PDA są tutaj skazani na męke (znam z autopsji )
po 4: nie możesz dynamicznie zmieniać wyglądu i ułożenia poszczególnych elementów
... jeszcze troche by się znalazło, i po woli staje się to standardem, już nikt niechce pocięcia layotu do tabeli, tylko xhtml+css@divs
pozdro

[ens0re]

Pozatym, odpowiedz sobie na to dla kogo są strony. Dla internautów, czyli jeżeli strona np bedzie sie za długo ładować to poprostu ją opuści. Tak samo jak kolega wyżej podał strona powinna wygladac we wszystkich(badz w 90%) urzadzen/przegladarkach tak samo. Czyli nie ze na PC bedzie wygladac ok, a np na Palmtopach sie rozleci całkowicie, i nie zapoinająć np o niepełnosprawnych osobach. Mogę stwierdzić, iż techniki hybrydowe(tabele+css) = zgodność wstecz, natomiast układy oparte na xhtml+css = zgodność w przód.

[krzysiekk]

czesc proponuje to zrobic tak:
plik
index.css
#1{
float:left;
display:inline;
background-color:#009900;
}
#2{
float:left;
display:inline;
background-color:#CC0000;
}
p{
margin: 0px;
}

===============================

index.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<title></title>
</head>
<link rel="stylesheet" type="text/css" href="index.css">

<body>
<div>
<div id="1"><p>tekst<br />asd<br />asd<br />asd<br />asd<br />asd<br />asd<br />asd<br />asd<br />asd<br />asd</p></div>
<div id="2"><p>drugi<br />asd<br />asd<br />asd<br />asd<br />asd<br />asd</p></div>
</div>
</body>
</html>

u mnie dziala pozdawiam chyba ze nie o to chodzi

[hwao]

Tak tak tylko na tej stronie jest stały wygląd strony a ja będę miał dynamicznie dodawane newsy.

Co powoduje rozciąganie...

Nie wiem czy stosowanie tego tricku z 20000px paddinga i marignesu na minusie jest dobrym wyjściem.

Czy to nie jest przejście z tabel na divy z którymi jak widać są problemy i trzeba się uciekać do sztuczek...
=[

Eh... ja nie stosuje zadnych marginow 2000 i wszytko mi pieknie dziala... jestes chyba leniwy az do tego stopnia ze nie czytasz co pisze w postach....

napisale u gory jak rozwiazac zeby byly rowne te divy, to po 1... po 2 podalem ci linka do strony.. jak jestes taki leniwy ze nawet nie chec ci sie czytac/sprobowac to poco wogole zakladasz temat...?

[Kuziu]

Dowód że czytałem - i tu właśnie jest mowa o tych trickach o których piszę a o których mówisz że nie czytałem =[ a czytałem =[

To po 1 bo czytałem i to nie 1 a z 20 tych linków które były pod adresem który podałeś.

Jedne traktowały o tym jak oszukać przeglądarke i nadać 20000 px i -20000 maringa by zrozumiały o co mi chodzi a drugie dawały w każdym divie kolejnego... co mnożyło ich ilość zamiast 3 miałęm 6 zamiast 8 - 16 ... Prosze nie mów że nie czytałem bo czytałem....

A to chyba nie jest wyjście ... przejśćie z tabel które są niby złe ... na DIV'y z którymi są problemy... Dlatego właśnie pytam

Wiedziałbym jak, nie pytałbym, nie wiem pytam.

Pytałem też kumpla. Bo to on właśnie powiedział mi że tabel raczej do dostosowywania layoutu nie powinienem uzywać. Ale nie wytłumaczył jak mam zrobić rozciągane tabele ... sam miał stronke w której wygląd jest wiecznie taki sam ... a jak zmieniany to przez niego a nie przez kogokolwiek kto może rozciągnąć stronkę

Ten post edytował Kuziu 28.03.2006, 00:04:41

[hwao]

http://webhost.bridgew.edu/etribou/layouts..._left_left.html

http://webhost.bridgew.edu/etribou/layouts...left_short.html

zeby cos takiego otrzmac to potrzeba 3 divow
leden float, 2'gi normlanie, i 3'ia stopka, ktora ma styl ze wszytko sie do niej wyrowna.