[HTML][CSS] Obramowanie

Dział stworzony do rozmów o programowaniu i tworzeniu stron internetowych. Oprócz tematów związanych z SAIL'em.
Awatar użytkownika
Xero Rozbójca
Soldier level 6
Soldier level 6
Posty: 391
Rejestracja: ndz mar 08, 2009 5:13 pm
Lokalizacja: Szukaj w kioskach...

[HTML][CSS] Obramowanie

Post autor: 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)
Załączniki
ScreenShot009.jpg
"Osoby, stawiające więcej niż trzy znaki interpunkcyjne obok siebie, mają problemy ze zdrowiem psychicznym."

Obrazek
Radzio
Site Administrator
Site Administrator
Poland
Posty: 2898
Rejestracja: pt lip 28, 2006 10:58 am
Lokalizacja: Bialystok, Poland

Re: HTML, CSS - Obramowanie

Post autor: 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/
Awatar użytkownika
Xero Rozbójca
Soldier level 6
Soldier level 6
Posty: 391
Rejestracja: ndz mar 08, 2009 5:13 pm
Lokalizacja: Szukaj w kioskach...

Re: HTML, CSS - Obramowanie

Post autor: 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 :D 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ę?
"Osoby, stawiające więcej niż trzy znaki interpunkcyjne obok siebie, mają problemy ze zdrowiem psychicznym."

Obrazek
Radzio
Site Administrator
Site Administrator
Poland
Posty: 2898
Rejestracja: pt lip 28, 2006 10:58 am
Lokalizacja: Bialystok, Poland

Re: HTML, CSS - Obramowanie

Post autor: 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/
Awatar użytkownika
Gothuk
Site Administrator
Site Administrator
Poland
Posty: 985
Rejestracja: wt wrz 04, 2007 6:10 pm
Lokalizacja: Poland, Warsaw
Kontakt:

Re: HTML, CSS - Obramowanie

Post autor: 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
Awatar użytkownika
YuriStriatov
Site Administrator
Site Administrator
Cuba
Posty: 1395
Rejestracja: pt lut 17, 2006 3:02 am
Kontakt:

Re: HTML, CSS - Obramowanie

Post autor: YuriStriatov »

Tak z 70% swiata srednio... czyli nikt, co nie :mrgreen: 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.
Obrazek
Radzio
Site Administrator
Site Administrator
Poland
Posty: 2898
Rejestracja: pt lip 28, 2006 10:58 am
Lokalizacja: Bialystok, Poland

Re: HTML, CSS - Obramowanie

Post autor: 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.
Awatar użytkownika
Xero Rozbójca
Soldier level 6
Soldier level 6
Posty: 391
Rejestracja: ndz mar 08, 2009 5:13 pm
Lokalizacja: Szukaj w kioskach...

Re: HTML, CSS - Obramowanie

Post autor: Xero Rozbójca »

To powie mi ktoś, czy da się zrobić obramowanie obrazkowe div'a w CSS 2.1 (lub starszym)?
"Osoby, stawiające więcej niż trzy znaki interpunkcyjne obok siebie, mają problemy ze zdrowiem psychicznym."

Obrazek
Radzio
Site Administrator
Site Administrator
Poland
Posty: 2898
Rejestracja: pt lip 28, 2006 10:58 am
Lokalizacja: Bialystok, Poland

Re: HTML, CSS - Obramowanie

Post autor: Radzio »

Czy ty przeczytałeś wszystkie nasze posty?

Da się, jeśli przyjmiesz przynajmniej stałą szerokość.
Awatar użytkownika
Xero Rozbójca
Soldier level 6
Soldier level 6
Posty: 391
Rejestracja: ndz mar 08, 2009 5:13 pm
Lokalizacja: Szukaj w kioskach...

Re: HTML, CSS - Obramowanie

Post autor: Xero Rozbójca »

Radzio pisze: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 :P

Kod: Zaznacz cały

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:

Kod: Zaznacz cały

<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)
"Osoby, stawiające więcej niż trzy znaki interpunkcyjne obok siebie, mają problemy ze zdrowiem psychicznym."

Obrazek
Awatar użytkownika
Gothuk
Site Administrator
Site Administrator
Poland
Posty: 985
Rejestracja: wt wrz 04, 2007 6:10 pm
Lokalizacja: Poland, Warsaw
Kontakt:

Re: HTML, CSS - Obramowanie

Post autor: Gothuk »

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

try:

Kod: Zaznacz cały

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

Kod: Zaznacz cały

<div id="ramki">
   <div class="ramka">&nbsp;</div>
    blabla
   <div class="ramka-prawa">&nbsp;</div>
 </div>
Awatar użytkownika
Xero Rozbójca
Soldier level 6
Soldier level 6
Posty: 391
Rejestracja: ndz mar 08, 2009 5:13 pm
Lokalizacja: Szukaj w kioskach...

Re: HTML, CSS - Obramowanie

Post autor: Xero Rozbójca »

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


@up
Robiłem tak samo jak napisałeś w poście wyżej i taki sam efekt był :)
Załączniki
ScreenShot010.jpg
"Osoby, stawiające więcej niż trzy znaki interpunkcyjne obok siebie, mają problemy ze zdrowiem psychicznym."

Obrazek
Radzio
Site Administrator
Site Administrator
Poland
Posty: 2898
Rejestracja: pt lip 28, 2006 10:58 am
Lokalizacja: Bialystok, Poland

Re: HTML, CSS - Obramowanie

Post autor: 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)
Awatar użytkownika
Xero Rozbójca
Soldier level 6
Soldier level 6
Posty: 391
Rejestracja: ndz mar 08, 2009 5:13 pm
Lokalizacja: Szukaj w kioskach...

Re: HTML, CSS - Obramowanie

Post autor: Xero Rozbójca »

Dobra, jednak zastosuję tabelkę zamiast "div", bo z tym to za dużo pieprzenia jest..
"Osoby, stawiające więcej niż trzy znaki interpunkcyjne obok siebie, mają problemy ze zdrowiem psychicznym."

Obrazek
ODPOWIEDZ