[HTML][CSS] Obramowanie

[Xero Rozbójca]

Jeśli ma ktoś kompletne obeznanie w językach HTML i CSS, to prosiłbym o pomoc.
Próbuję zrobić następujące rzeczy:

#1 Pole na newsy, które się poszerza w miarę pisania tekstu w html tak, aby nie trzeba było na okrągło manipulować szerokością...

#2 Chciałem zrobić obramowanie pola na newsy tak, aby zamiast zwykłego obramowania był wybrany przeze mnie obrazek oraz powtarzał się, gdy tylko okienko się poszerzy i nie wiem, jak to napisać... :/ (Patrz załącznik nr 1)

[Radzio]

1) Jeśli nie ustawisz szerokości, to będzie się poszerzać wraz z ilością tekstu, do szerokości ekranu.
2) http://radek.w.tkb.pl/xero/

[Xero Rozbójca]

Aha, czyli "." w css oznacza klasę, a "#" identyfikator. Czym to się różni?
Tak wgl, to nigdy nie używałem lokalnych arkuszy stylów. Z przyzwyczajenia robię wszystko w jednym dokumencie xd

Dzięki za przykład w 2. odpowiedzi Wcale tak sprytnie ukryta ta twoja tajemnica nie była. A gdybym np. chciał zrobić to nie w tabeli, a normalnie w div, dałoby radę?

[Radzio]

1:
Dany element może mieć wiele klas i wiele elementów może mieć tę samą klasę.
Dany element może mieć tylko jeden identyfikator i tylko jeden element może mieć taki identyfikator.

2:
Primo, divy nie są ze sobą tak ściśle powiązane jak komórki w tabeli, więc trzeba by było ustawić stałą szerokość i wysokość dla ramek.
Secundo, do stworzenia ramek po lewej i prawej stronie trzeba użyć 'float', które jest zmorą dla IE poniżej 8.
Tertio, HTML5 zakłada zrezygnowanie z divów na rzecz bardziej odpowiednich tagów.


http://radek.w.tkb.pl/xero/

[Gothuk]

http://www.css3.info/preview/border-image/
tyle ze css3, wiec IEshit obslugiwac nie bedzie. Ale w sumie kto uzywa takiej zj****ej przegladarki... ;d

[YuriStriatov]

Tak z 70% swiata srednio... czyli nikt, co nie Akurat border-image to poki co tylko eksperymentalnie jest obslugiwane z tego co pamietam, i w kazdej przegladarce ktora obsluguje to inaczej wyglada. Tak wiec pobawic sie mozna, ale nic wiecej... na to zeby kazda przegladarka to obslugiwala porzadnie to sobie jeszcze poczekamy.

[Radzio]

Nawet IE9 (dostępne obecnie jako druga wersja testowa) nie potrafi sobie z tym poradzić, więc nie ma mowy o zastosowaniu tego w ciągu najbliższych lat.

[Xero Rozbójca]

To powie mi ktoś, czy da się zrobić obramowanie obrazkowe div'a w CSS 2.1 (lub starszym)?

[Radzio]

Czy ty przeczytałeś wszystkie nasze posty?

Da się, jeśli przyjmiesz przynajmniej stałą szerokość.

[Xero Rozbójca]

1:
Dany element może mieć wiele klas i wiele elementów może mieć tę samą klasę.
Dany element może mieć tylko jeden identyfikator i tylko jeden element może mieć taki identyfikator.

No i frack. Ja tego "float" nie ogarniam

Code: Select all

div#ramki.ramka {
	background: url(obramowanie-srodek.png) repeat;
	width: 10px;
	float: left;
}

div#ramki.ramka-prawa {
	background: url(obramowanie-srodek.png) repeat;
	width: 10px;
	float: right;
}

a w dokumencie:

Code: Select all

<div id="ramki" class="ramka ramka-prawa">blabla</div>

Kombinuję, kombinuję i ch*j, nadal nie ma po prawej stronie ramki xD (po lewej już jest)

[Gothuk]

nie mozesz przypisac jednemu elementowi float:left; i float:right; przeciez element ten sie nie rozdwoi ^^.

try:

Code: Select all

<div id="ramki" class="ramka">blabla</div>
<div id="ramki" class="ramka-prawa">&nbsp;</div>

a jeszcze lepiej:

Code: Select all

<div id="ramki">
   <div class="ramka">&nbsp;</div>
    blabla
   <div class="ramka-prawa">&nbsp;</div>
 </div>

[Xero Rozbójca]

Serio to niby miało podziałać? (Załącznik)


@up
Robiłem tak samo jak napisałeś w poście wyżej i taki sam efekt był

[Radzio]

Najpierw zapamiętaj, że dany identyfikator może mieć również tylko jeden element. Inaczej będą pojawiały się dziwne problemy. Jeśli wiele elementów ma mieć określone właściwości, to należy używać samych klas.

Elementy pływające muszą mieć też określoną wysokość bądź być wypełnione konkretną treścią. To nie działa tak jak tabelka.

przykład: http://radek.w.tkb.pl/xero/divowo.html (stała jest wysokość, więc nie dopasowuje się do treści)

[Xero Rozbójca]

Dobra, jednak zastosuję tabelkę zamiast "div", bo z tym to za dużo pieprzenia jest..