/ Forside / Teknologi / Udvikling / HTML / Nyhedsindlæg
Login
Glemt dit kodeord? 		Brugernavn

Kodeord


Reklame
Top 10 brugere
HTML
#NavnPoint
1  molokyle 11184
2  Klaudi 5506
3  bentjuul 3377
4  severino 2040
5  smorch 1950
6  strarup 1525
7  natmaden 1396
8  scootergr.. 1320
9  e.c 1150
10  miritdk 1110
css knap
Fra : Tommy Olesen

Dato : 09-09-02 19:59
jeg prøver at få nedenstående css-tutorial til at virke med lidt
tillempning (position: absolute/ z-index), men knappen "skubber
rundt" med knap-teksten... alle forslag - med og uden eksempler -
modtages med tak.

... her er tutorialen :
http://www.boogiejack.com/howx021.html


... og her er mit forsøg:
http://snow.prohosting.com/rarman

--
Vil du lære at kode HTML, XHTML, CSS, SSI eller ASP ???
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

 
 
rofe@mailme.dk (09-09-2002)
Kommentar
Fra : rofe@mailme.dk

Dato : 09-09-02 20:27
Hej Tommy

Du skal ikke (jeg tror faktisk ikke man kan) give a:link eller a:(hvad som
helst) et z-index.

Når du bruger position og z-index er det layers og disse laves oftest i
<div> og ikke i <table>

Prøv at lave to <div>'s

<div id="tekst">tekst med <a href="#">link</a></div>
<div id="baggrund"><img src="image.gif"></div>

id skal laves som
#tekst {
z-index: 1;
etc..... som du har gjort med left, top etc
}

og ligeså med baggrund som vist nok skal have z-index: 0; men kan ikke huske
det :)

Prøv det.... og skriv hvis du ikke kan få det til at virke eller forstår
hvad jeg mener

m v h
Ronni
rofe@mailme.dk



"Tommy Olesen" <tho@mail1.stofanet.dk> wrote in message
news:alir1l$pri$1@sunsite.dk...
> jeg prøver at få nedenstående css-tutorial til at virke med lidt
> tillempning (position: absolute/ z-index), men knappen "skubber
> rundt" med knap-teksten... alle forslag - med og uden eksempler -
> modtages med tak.
>
> .. her er tutorialen :
> http://www.boogiejack.com/howx021.html
>
>
> .. og her er mit forsøg:
> http://snow.prohosting.com/rarman
>
> --
> Vil du lære at kode HTML, XHTML, CSS, SSI eller ASP ???
> - Pædagogiske tutorials på dansk
> - Kom godt i gang med koderne
> KLIK HER! => http://www.html.dk/tutorials



Knud Gert Ellentoft (09-09-2002)
Kommentar
Fra : Knud Gert Ellentoft

Dato : 09-09-02 21:41
Mon, 9 Sep 2002 21:26:32 +0200, skrev <rofe@mailme.dk>:

>Du skal ikke (jeg tror faktisk ikke man kan) give a:link eller a:(hvad som
>helst) et z-index.

Man kan kun bruge position og z-index på et blockelement.
(<p>, <h1>, <div> osv.)
--
Knud - http://home13.inet.tele.dk/smedpark/
Når der svares på et indlæg, svar venligst under det citerede og
skær venligst det væk, du ikke svarer på, ellers ryger du i killfiltret.
Svar kun i nyhedsgruppen - tak! E-mails besvares ikke.

Kurt Kristensen (09-09-2002)
Kommentar
Fra : Kurt Kristensen

Dato : 09-09-02 20:34
Tommy Olesen wrote in dk.edb.internet.webdesign.html:
> jeg prøver at få nedenstående css-tutorial til at virke med lidt
> tillempning (position: absolute/ z-index), men knappen "skubber
> rundt" med knap-teksten... alle forslag - med og uden eksempler -
> modtages med tak.
>
> ... her er tutorialen :
> http://www.boogiejack.com/howx021.html
>
>
> ... og her er mit forsøg:
> http://snow.prohosting.com/rarman

Jeg har prøvet dine koder uden z-index, og så fungerer de fint.
Men kan du ikke fortælle lidt om dine css-koder. Hvad bruger du
z-index til her?

--
Vil du lære at kode HTML, XHTML, CSS, SSI eller ASP ???
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Tommy Olesen (10-09-2002)
Kommentar
Fra : Tommy Olesen

Dato : 10-09-02 20:05
> Jeg har prøvet dine koder uden z-index, og så fungerer de fint.
> Men kan du ikke fortælle lidt om dine css-koder. Hvad bruger du
> z-index til her?

jeg kan ikke få knappens teksttil at stå lige over billedet af
knappen, og troede derfor at det var muligt at bruge z-index ( og
position absolute ) til dette
>
> --
> Vil du lære at kode HTML, XHTML, CSS, SSI eller ASP ???
> - Pædagogiske tutorials på dansk
> - Kom godt i gang med koderne
> KLIK HER! => http://www.html.dk/tutorials


--
Vil du lære at kode HTML, XHTML, CSS, SSI eller ASP ???
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Tommy Olesen (17-09-2002)
Kommentar
Fra : Tommy Olesen

Dato : 17-09-02 21:42
efter jeres indlæg er her hvad jeg har fået stykket sammen
foreløbigt:

http://www.friserverplads.dk/rarman/testknap.htm


... mit spørgsmål lyder så: jeg havde noget besvær med at placere
teksterne lige over knapperne, og som I jo kan se har jeg benyttet
minus værdier i nogle "bottom #tekst" tags... er det "korrekt css" ,
og/eller er der en bedre måde at opnå det samme ?
mvh, Tommy Olesen


her er mit html:

<html>


<head>
<LINK REL="StyleSheet" HREF="hps.css" TYPE="text/css">
</head>

<body>


<div id="tekst1"><a href="#">11.sep.2002</a></div>
<div id="baggrund1"><img src="blank.gif"></div>
<div id="tekst2"><a href="#">babewatch</a></div>
<div id="baggrund2"><img src="blank.gif"></div>
<div id="tekst3"><a href="#">horrorscope</a></div>
<div id="baggrund3"><img src="blank.gif"></div>
<div id="tekst4"><a href="#">ulysses</a></div>
<div id="baggrund4"><img src="blank.gif"></div>



</body>

</html>


... og her mit css:

a {
z-index: 2;
color:lightblue;
font: 900;
position:absolute;
left:61px;
bottom:100px;
text-decoration: none
}

a:hover {
z-index: 2;
color:yellow;
font: 900;
position:absolute;
left:61px;
bottom:100px;
text-decoration: none
}



#baggrund1 {
z-index: 1;
position:absolute;
left:10px;
bottom:56px;
}

#baggrund2 {
z-index: 1;
position:absolute;
left:10px;
bottom:76px;
}

#baggrund3 {
z-index: 1;
position:absolute;
left:10px;
bottom:96px;
}

#baggrund4 {
z-index: 1;
position:absolute;
left:10px;
bottom:116px;
}

#tekst1 {
z-index:2;
position:absolute;
left:-45px;
bottom:18px;
}

#tekst2 {
z-index:2;
position:absolute;
left:-45px;
bottom:-3px;
}

#tekst3 {
z-index:2;
position:absolute;
left:-45px;
bottom:-22px;
}

#tekst4 {
z-index:2;
position:absolute;
left:-28px;
bottom:-42px;
}




--
Vil du lære at kode HTML, XHTML, CSS, SSI eller ASP ???
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Knud Gert Ellentoft (17-09-2002)
Kommentar
Fra : Knud Gert Ellentoft

Dato : 17-09-02 23:25
Tue, 17 Sep 2002 20:42:21 +0000 (UTC), skrev Tommy Olesen
<tho@mail1.stofanet.dk>:

>.. mit spørgsmål lyder så: jeg havde noget besvær med at placere
>teksterne lige over knapperne, og som I jo kan se har jeg benyttet
>minus værdier i nogle "bottom #tekst" tags... er det "korrekt css" ,
>og/eller er der en bedre måde at opnå det samme ?

Må jeg have lov til at foreslå en helt anden løsning (og bedre
efter min mening)?

Som jeg har forstået det, så vil du gerne kunne genbruge den
samme knap med forskellig tekst til links uden at skulle teksten
på hver enkelt knap.

Indsæt knapperne som baggrundsbillede i stedet for at positionere
teksten med position og z-index.

Som du har konstateret, så er det svært at ramme det præcist
samtidig med at de med sikkerhed ikke vil blive vist ens i
forskellige browsere.

Så derfor har jeg lavet det på min forslåede måde på
<http://home13.inet.tele.dk/smedpark/test/tho/>

Css er for nemheds skyld placeret i <head>, men kan selvf.
sagtens være et cssark.
--
Knud - http://home13.inet.tele.dk/smedpark/
Når der svares på et indlæg, svar venligst under det citerede og
skær venligst det væk, du ikke svarer på, ellers ryger du i killfiltret.
Svar kun i nyhedsgruppen - tak! E-mails besvares ikke.
Søg
Reklame
Statistik
Spørgsmål : 177560
Tips : 31968
Nyheder : 719565
Indlæg : 6408946
Brugere : 218888
Månedens bedste
Årets bedste
Sidste års bedste
Copyright © 2000-2024 kandu.dk. Alle rettigheder forbeholdes.