[es] - border oko slika

DeX-Force
Beograd

Član broj: 37831
Poruke: 324

Profil

^{07.04.2005. u 19:47 - pre 231 meseci}

Kako da napravim da border oko slike koja je ujedno i link menja boju kada se prelazi misem preko nje. Uspeo sam samo dodavanjem id-ja u <a> tag ali to radi samo iz Firefox-a. Kako da ovo radi i iz IE-a?

Odgovor na temu

boccio
Boris Krstović
Spoonlabs.com
nbgd

Član broj: 7594
Poruke: 2458
*.ptt.yu.

Sajt: bocc.io

+771 Profil

Re: border oko slika

^{07.04.2005. u 20:35 - pre 231 meseci}

cisto napamet...jesi probao:

a:hover {
border: 1px #ccc solid;
}

i onda normalno <a href="..."><img /></a>

Jeff, one day you’ll understand that it’s harder to be kind than clever.

Odgovor na temu

DeX-Force
Beograd

Član broj: 37831
Poruke: 324

Profil

Re: border oko slika

^{07.04.2005. u 21:10 - pre 231 meseci}

Ne razumem bas kako to da uradim. Ako si mislio da napravim stvarno a i a:hover onda mi to menja sve linkove, a to ne zelim, znaci zelim samo odredjeni ID da dodelim toj slici/linku.

Mozda sam trebao na pocetku da naglasim da sam pocetnik u ovome. :)

Odgovor na temu

boccio
Boris Krstović
Spoonlabs.com
nbgd

Član broj: 7594
Poruke: 2458
*.ptt.yu.

Sajt: bocc.io

+771 Profil

Re: border oko slika

^{07.04.2005. u 23:15 - pre 231 meseci}

#neki_id a:hover {
border: 1px #ccc solid;
}

Jeff, one day you’ll understand that it’s harder to be kind than clever.

Odgovor na temu

DeX-Force
Beograd

Član broj: 37831
Poruke: 324

Profil

Re: border oko slika

^{08.04.2005. u 21:11 - pre 231 meseci}

Evo pokusao sam ovako:

#AddsBox{
border: 2px solid #6699CC;

}

#AddsBox:hover {
border: 2px solid #FF9900;

}

<td width="165" height="92" align="center" valign="middle">
<a href="som.htm" id="AddsBox"><img src="advertising/som_baner.gif" width="160" height="90" border="0"></a></td>

i sada to da kazem radi, ali ne potpuno, sada nemam top border, i nikako nemogu to da resim zasto mi se to desava? Pokusao sam da stavim i border-top, left, right, bottom i nista i dalje mi se top ne pojavljuje ???

Odgovor na temu

adelante
Davor Zeljković
artijana.com, vlasnik
Zrenjanin

Član broj: 22649
Poruke: 126
*.dialup.neobee.net.

Sajt: www.artijana.com

Profil

Re: border oko slika

^{09.04.2005. u 09:39 - pre 231 meseci}

au
tesko ce moci tako :)

probaj ovo

umesto

Code:

#AddsBox{
border: 2px solid #6699CC;

}

#AddsBox:hover {
border: 2px solid #FF9900;

}

stavi

Code:

#AddsBox a: {
border: 2px solid #6699CC;
}
#AddsBox a:hover {
border: 2px solid #FF9900;
}

i ovo ovako

umesto

Code:

<td width="165" height="92" align="center" valign="middle">
<a href="som.htm" id="AddsBox"><img src="advertising/som_baner.gif" width="160" height="90" border="0"></a></td>

stavi

Code:

<td width="165" height="92" align="center" valign="middle">
<a href="som.htm" id="AddsBox"><img src="advertising/som_baner.gif" width="160" height="90"></a></td>

_{//edit boccio: formatirajte kôd da poruka bude čitljivija}

_{[Ovu poruku je menjao boccio dana 09.04.2005. u 13:09 GMT+1]}

Solarni kolektori

Odgovor na temu

Br@nkoR
http://localhost

Član broj: 2597
Poruke: 1603

Sajt: localhost

+23 Profil

Re: border oko slika

^{09.04.2005. u 10:31 - pre 231 meseci}

Ovim kodom će još teže ići.

^{Banned - Not available}

Odgovor na temu

DeX-Force
Beograd

Član broj: 37831
Poruke: 324

Profil

Re: border oko slika

^{09.04.2005. u 11:36 - pre 231 meseci}

Da, tako tek ne radi, ali kako treba?

Odgovor na temu

boccio
Boris Krstović
Spoonlabs.com
nbgd

Član broj: 7594
Poruke: 2458
*.ptt.yu.

Sajt: bocc.io

+771 Profil

Re: border oko slika

^{09.04.2005. u 12:01 - pre 231 meseci}

Pa lepo sam ti u prvom postu rekao sta da uradis. Da si u tom pravcu krenuo, nasao bi resenje...

Code:

div#AddsBox img {border:2px solid #6699CC}
div#AddsBox a:hover img {border:2px solid #FF9900}

/* ovo mora zbog IE */
div#AddsBox a {color:#6699CC}
div#AddsBox a:hover{color:#FF9900}

<div id="AddsBox">
<a href="#"><img src="nesto.gif" border="0" /></a>
</div>

Ali svi ovde ocigledno cekaju resenje na tacni...E, pa evo - resenje servirano, izvol'te pristupiti cut'n'paste-u.

OK je sto kazes da si pocetnik, zato smo tu da ti pomognemo, ali ovo ne znaci nista ako ces samo iskopirati i ne zanima te zasto ovo radi, a ono tvoje ne. Nauci osnove CSS-a, to bar nije problem, nemoj samo traziti gotova resenja koja ces iskopirati u svoj kod.

Jeff, one day you’ll understand that it’s harder to be kind than clever.

Odgovor na temu

DeX-Force
Beograd

Član broj: 37831
Poruke: 324

Profil

Re: border oko slika

^{09.04.2005. u 13:04 - pre 231 meseci}

Pa ni ovo bas ne radi, ne radi se ovde o cut & paste, ja zelim ovo da naucim, ali sam potpuni pocetnik i ne znam u kom pravcu da idem na osnovu toga sto mi ti das jer nista vise ni ne znam.

Sa ovom zadnjom varijantom na tacni, u IE-u su leva i donja ivica bordera deblje od gornje i desne, a u FF-u je donji border dupliran...

Odgovor na temu

Br@nkoR
http://localhost

Član broj: 2597
Poruke: 1603

Sajt: localhost

+23 Profil

Re: border oko slika

^{09.04.2005. u 13:11 - pre 231 meseci}

Joj bre.
Probaj ovako npr:
html:

Code:

<td width="165" height="92" align="center" valign="middle">
<a href="som.htm" id="AddsBox"><img src="advertising/som_baner.gif" width="160" height="90" border="0"></a></td>

css:

Code:

#AddsBox{
  border: 2px solid #6699CC;
  display: block;
}
#AddsBox:hover {
  border: 2px solid #FF9900;
  display: block;
}

Obrati pažnju i na veličinu celije tabele u kojoj se nalazi ova slika.

_{[Ovu poruku je menjao Br@nkoR dana 09.04.2005. u 14:27 GMT+1]}

^{Banned - Not available}

Odgovor na temu

boccio
Boris Krstović
Spoonlabs.com
nbgd

Član broj: 7594
Poruke: 2458
*.ptt.yu.

Sajt: bocc.io

+771 Profil

Re: border oko slika

^{09.04.2005. u 13:11 - pre 231 meseci}

Ajde probaj ovo na "suvo", tj. kao poseban test-fajl, pa vidi da li radi korektno. Ako radi (a moralo bi) znaci da tvoj se u tvom, postojecem CSS fajlu vuce neko nasledjivanje. Postuj onda kompletan CSS.

Jeff, one day you’ll understand that it’s harder to be kind than clever.

Odgovor na temu

adelante
Davor Zeljković
artijana.com, vlasnik
Zrenjanin

Član broj: 22649
Poruke: 126
*.dialup.neobee.net.

Sajt: www.artijana.com

Profil

Re: border oko slika

^{09.04.2005. u 14:01 - pre 231 meseci}

I ja sam došao do sličnog rešenja kao što je Br@nkoR napisao samo treba dodati u <td> tag ovo id="AddsBox". ne znam zašto.
ali samo tako radi

evo ga moj kod sto sam uradio

Code:
#AddsBox {
display: block;
}
#AddsBox a:link {
border: 2px solid #6699CC;
}
#AddsBox a:hover {
border: 2px solid #FF9900;
}

<td width="165" height="92" align="center" valign="middle" id="AddsBox">
<a href="som.htm" id="AddsBox"><img src="advertising/som_baner.gif" width="160" height="90" border="0"></a></td>

i probao sam radi u IE 6, firefox, opera

e sad možda to može elegantnije da se uradi ja ne znam.

Solarni kolektori

Odgovor na temu

DeX-Force
Beograd

Član broj: 37831
Poruke: 324

Profil

Re: border oko slika

^{09.04.2005. u 16:15 - pre 231 meseci}

Ma meni radi i ovako i u drugom praznom fajlu isto. Kada napravim ili za IE ili za FF kao sto si pre rekao.

Kada stavim ovako:

Code:
div#AddsBox img{ border: 1px solid #6699CC;}
div#AddsBox a:hover img{ border: 1px solid #FF9900;}

onda radi iz FF-a ali ne iz IE-a

a kada stavim ovako:

Code:
div#AddsBox a{ border: 1px solid #6699CC;}
div#AddsBox a:hover { border: 1px solid #FF9900;}

onda je situacija obrnuta :)

Kada stavim oba kao sto si mi rekao onda imam neke duple bordere sto je meni nekako i logicno tako da sam dosao do zakljucka da tu fali i jos neki - if IE then ovo i td... ali ne znam jesam li u pravu i kako se tek to radi u CSS-u

Odgovor na temu

DeX-Force
Beograd

Član broj: 37831
Poruke: 324

Profil

Re: border oko slika

^{09.04.2005. u 16:22 - pre 231 meseci}

E radi kad se doda ovo

display: block; :)

a sad me interesuje cemu to tacno sluzi?

Odgovor na temu

Br@nkoR
http://localhost

Član broj: 2597
Poruke: 1603

Sajt: localhost

+23 Profil

Re: border oko slika

^{09.04.2005. u 17:19 - pre 231 meseci}

http://www.w3.org/TR/CSS21/visuren.html#display-prop

^{Banned - Not available}

Odgovor na temu