[HTML][CSS]Powtarzalne ID elementu., Co na to W3C? Opcje

[lepmajster]

Czesc
Mam pytanie, czy mozna powtarzac ID danego elementu, np tak:

[HTML] pobierz, plaintext 
<div class="rysuj_okienko" id="czerwony_kolor">jakas tresc</div>
<div class="rysuj_okienko" id="czerwony_kolor">Inna tresc</div>
[HTML] pobierz, plaintext 

Chodzi o to, czy mozna stosowac ID jako dodatkowe atrybuty zdefiniowane wczesniej w CSS.
I czy taki ID mozna bezgranicznie powtarzac, bo spotkalem sie z opinia ze nie wolno tak robic, ze ID powinien byc unikalny dla kazdego elementu.
Tyle ze potrzebne mi cos oprocz class do przypisywania styli, bo np CLASS odpowiada u mnie za narysowanie ogolnego okienka, a ID odpowiadal by za kolorystyke.
Moze jest jakies inne wyjscie.
Mam nadzieje ze jest to zrozumiale, o co mi chodzi.

Druga sprawa padding.
Wiadomo ze ten atrybut rozciaga nam diva, mozna jakos temu zapobiec?
Wiem ze moge odjac od width diva okreslona ilosc px, zeby z paddingiem nadal mial taki rozmiar jak trezba, ale z tego co pamietam niektore przegladarki nie rozszerzaly divow przy paddingu i moze mi sie strona rozjechac.

Ten post edytował lepmajster 21.05.2010, 15:29:12

[wookieb]

Id elementu w całym dokumencie nie może się powtarzać.

[tehaha]

Id to identyfikator jak sama nazwa wskazuje służy do identyfikacji i nie powinien się powtórzyć, jeżeli chcesz wielu elementom nadać takie same style css to zrób z tego klasę class="czerwony_kolor"

[Mateusz_Babiarz]

Tylko jeden Id, bo zalozenie jest takie ze ma byc unikalny. Jak bedziesz mial powtorzenia to kazdy validator Ci to wychwyci jako blad.

Co do problemu, to mozesz zrobic np tak :

[HTML] pobierz, plaintext 
<div class="rysuj_okienko czerwony_kolor">Inna tresc</div>
[HTML] pobierz, plaintext 

albo posluzyc sie DOMem

[lepmajster]

Id to identyfikator jak sama nazwa wskazuje służy do identyfikacji i nie powinien się powtórzyć, jeżeli chcesz wielu elementom nadać takie same style css to zrób z tego klasę class="czerwony_kolor"

Nie rozumiesz mnie, musze narazie uzywac id zeby okna sie roznily.
Bo jesli bede uzywal tylko klasy, to jak drugiemu okienku bede chcial nadac inny kolor, to bede musial praktycznie skopiowac cala klase, nadac jej inna nazwe i zmienic np tylko kolor, przez to dokument css bedzie przepelniony klasami dla kazdego okna osobno.
Narazie id daje rade, bo chcac zmienic kolorystyke w jednym oknie, wystarczy zmienie id.

Tylko jeden Id, bo zalozenie jest takie ze ma byc unikalny. Jak bedziesz mial powtorzenia to kazdy validator Ci to wychwyci jako blad.

Co do problemu, to mozesz zrobic np tak :

[HTML] pobierz, plaintext 
<div class="rysuj_okienko czerwony_kolor">Inna tresc</div>
[HTML] pobierz, plaintext 

albo posluzyc sie DOMem

A moglbys przyblizyc mi ten sposob?
Co to jest "rysuj_okienko czerwony_kolor", jak to w css zdefiniowac?

[tehaha]

Wiem ze moge odjac od width diva okreslona ilosc px, zeby z paddingiem nadal mial taki rozmiar jak trezba, ale z tego co pamietam niektore przegladarki nie rozszerzaly divow przy paddingu i moze mi sie strona rozjechac.

padding odejmuje się od szerokości, jedyna przeglądarka która ma z tym problem to IE6 taki że podwaja ten padding i się coś może rozjechać, ale wtedy dodajesz atrybut display:inline; i jest ok

class="rysuj_okienko czerwony_kolo" oznacza że element ma 2 klasy: rysuj_okienko i czerwony_kolo

w css dajesz

.rysuj_okienko{}
.czerwony_kolo

po prostu jednemu elementowi możesz nadać dowolną ilość klas


Ten post edytował tehaha 21.05.2010, 15:36:29

[Pawel_W]

padding był wliczany w szerokość diva w starszych przeglądarkach, jak np. IE 6.0

teraz wszystkie przeglądarki dodają go do szerokości

[lepmajster]

padding był wliczany w szerokość diva w starszych przeglądarkach, jak np. IE 6.0

teraz wszystkie przeglądarki dodają go do szerokości

To troche komplikuje mi sytuacje, bo chcialem stworzyc dynamicznie generowane divy, ze ktos wpisuje w pole szerokosc np 180px i padding np 5px, wtedy div bedzie mial 190px, ale to jeszcze mozna w kodzie php odjac (szerokosc-(2xpadding)), gorzej jak ktos w okienku PADDING: wpisze 5px 0px 5px 5px; wtedy bede musial pierw porozdzielac ten wpis na pojedyncze wartosci i zsumowac left+right i dopiero odjac od szerokosci, ciezka sprawa

Tylko jeden Id, bo zalozenie jest takie ze ma byc unikalny. Jak bedziesz mial powtorzenia to kazdy validator Ci to wychwyci jako blad.

Co do problemu, to mozesz zrobic np tak :

[HTML] pobierz, plaintext 
<div class="rysuj_okienko czerwony_kolor">Inna tresc</div>
[HTML] pobierz, plaintext 

albo posluzyc sie DOMem

A moglbys przyblizyc mi ten sposob?
Co to jest "rysuj_okienko czerwony_kolor", jak to w css zdefiniowac?

Ten post edytował lepmajster 21.05.2010, 15:41:42

[Pawel_W]

to są prostu 2 oddzielne style

[HTML] pobierz, plaintext 
.rysuj_okienko {
}
.czerwony_kolor {
 
}
[HTML] pobierz, plaintext 

co do problemu z IE to możesz bawić się 'expressions', tylko IE je obsługuje

Ten post edytował Pawel_W 21.05.2010, 15:44:21

[lepmajster]

to są prostu 2 oddzielne style

czyli takie cos?

[CSS] pobierz, plaintext 
.rysuj_okno{
width: 180px;
height: auto;
border: 1px solid #000000;
}
.czerwony_kolor {
background: #FF0000;
}
[CSS] pobierz, plaintext 

[HTML] pobierz, plaintext 
<div class="rysuj_okno czerwony_kolor"></div>
[HTML] pobierz, plaintext 

Jesli to faktycznie dziala, to wlasnie o to mi chodzilo
Fajnie ze ktos mnie zrozumial, bo trudno mi bylo to wytlumaczyc.
Dzieki wszystkim za pomoc!
Daje Wam pomogl.

PS. A ile takich klas mozna laczyc?

CO DO PADDING, Nie ma innego sposobu?

padding był wliczany w szerokość diva w starszych przeglądarkach, jak np. IE 6.0

teraz wszystkie przeglądarki dodają go do szerokości

To troche komplikuje mi sytuacje, bo chcialem stworzyc dynamicznie generowane divy, ze ktos wpisuje w pole szerokosc np 180px i padding np 5px, wtedy div bedzie mial 190px, ale to jeszcze mozna w kodzie php odjac (szerokosc-(2xpadding)), gorzej jak ktos w okienku PADDING: wpisze 5px 0px 5px 5px; wtedy bede musial pierw porozdzielac ten wpis na pojedyncze wartosci i zsumowac left+right i dopiero odjac od szerokosci, ciezka sprawa

Ten post edytował lepmajster 21.05.2010, 15:55:26

[tehaha]

PS. A ile takich klas mozna laczyc?

CO DO PADDING, Nie ma innego sposobu?

1.możesz nadawać dowolną ilość klas
2.dodanie atrybutu display:inline likwiduje problem z IE6