[ DeX-Force @ 07.04.2005. 19:47 ] @
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?
[ boccio @ 07.04.2005. 20:35 ] @
cisto napamet...jesi probao:

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

i onda normalno <a href="..."><img /></a>
[ DeX-Force @ 07.04.2005. 21:10 ] @
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. :)
[ boccio @ 07.04.2005. 23:15 ] @
#neki_id a:hover {
border: 1px #ccc solid;
}
[ DeX-Force @ 08.04.2005. 21:11 ] @
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 ???
[ adelante @ 09.04.2005. 09:39 ] @
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]
[ Br@nkoR @ 09.04.2005. 10:31 ] @
Ovim kodom će još teže ići.
[ DeX-Force @ 09.04.2005. 11:36 ] @
Da, tako tek ne radi, ali kako treba?
[ boccio @ 09.04.2005. 12:01 ] @
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.
[ DeX-Force @ 09.04.2005. 13:04 ] @
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...

[ Br@nkoR @ 09.04.2005. 13:11 ] @
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]
[ boccio @ 09.04.2005. 13:11 ] @
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.
[ adelante @ 09.04.2005. 14:01 ] @
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.
[ DeX-Force @ 09.04.2005. 16:15 ] @
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
[ DeX-Force @ 09.04.2005. 16:22 ] @
E radi kad se doda ovo

display: block; :)

a sad me interesuje cemu to tacno sluzi?

[ Br@nkoR @ 09.04.2005. 17:19 ] @
http://www.w3.org/TR/CSS21/visuren.html#display-prop
[ DeX-Force @ 09.04.2005. 18:01 ] @
Hvala puno. :)