SELFHTML Forum
SELFHTML Forumsarchiv
2005
Dezember
 |
SELFHTML Forumsarchiv |
 |
|
 |
|
Die folgende Nachricht zum Thema stammt von: opi, 31. 12. 2005, 15:58
Hallo,
wie kann ich einen Link in einem div-Element positionieren?
.button_submit {
width:60%;
margin:0 auto; padding:0;
text-align:center;
}
.button_submit a {
display:block;
width:104px; height:20px;
background:url(/img/button_submit.gif);
}
.button_submit a:hover {
background:url(/img/button_submit_hover.gif);
}
<div class="button_submit"><a href="#"></a></div>
Das Image wird leider immer linksbündig angezeigt und nicht
zentriert. Mache ich da was falsch?
Greez,
opi
--
Selfcode: ie:( fl:( br:^ va:) ls:] fo:) rl:( n4:? ss:| de:] ch:? mo:|
Die folgende Nachricht zum Thema stammt von: Ingo Turski, 31. 12. 2005, 16:18
Hi,
»» .button_submit {
»» width:60%;
»» margin:0 auto; padding:0;
damit zentrierst Du das DIV
»» text-align:center;
und damit dessen inline-Elemente.
»» .button_submit a {
»» display:block;
jetzt ist a kein inline-Element mehr, auf das text-align Anwendung findet.
freundliche Grüße
Ingo
--
[barrierefreie Webseitenerstellung » Suchmaschinenoptimierung | em?] (Hommingberger Gepardenforelle;-)
Die folgende Nachricht zum Thema stammt von: opi, 31. 12. 2005, 16:25
Hallo Ingo,
»» »» .button_submit a {
»» »» display:block;
»» jetzt ist a kein inline-Element mehr, auf das text-align Anwendung findet.
ok ...
.button_submit a {
display:block;
margin:0 auto;
...
}
aber da macht der IE doch Probleme, soweit ich weiss. Gibt es noch
eine andere Alternative für mich, ausser das ich ein weiteres div-
Element nutzen muss?
Greez,
opi
--
Selfcode: ie:( fl:( br:^ va:) ls:] fo:) rl:( n4:? ss:| de:] ch:? mo:|
Die folgende Nachricht zum Thema stammt von: opi, 31. 12. 2005, 16:28
Hallo Ingo,
Lösung gefunden ...
.button_submit {
width:60%;
margin:0 auto; padding:0;
width:104px; height:20px;
}
.button_submit a {
width:100%; height:100%;
display:block;
background:url(/img/button_submit.gif);
}
.button_submit a:hover {
background:url(/img/button_submit_hover.gif);
}
<div class="button_submit"><a href="#"></a></div>
klappt. Danke :)
Greez,
opi
--
Selfcode: ie:( fl:( br:^ va:) ls:] fo:) rl:( n4:? ss:| de:] ch:? mo:|
Die folgende Nachricht zum Thema stammt von: Ingo Turski, 31. 12. 2005, 16:41
Hi,
»» .button_submit a {
»» display:block;
»» margin:0 auto;
»» ...
»» }
»»
»» aber da macht der IE doch Probleme, soweit ich weiss. Gibt es noch
»» eine andere Alternative für mich, ausser das ich ein weiteres div-
»» Element nutzen muss?
brauchst Du überhaupt dieses eine DIV?
Und was den IE betrifft: der wendet text-align bekanntlich auch auf blocklevel-Elemente an.
freundliche Grüße
Ingo
--
[barrierefreie Webseitenerstellung » Suchmaschinenoptimierung | em?] (Hommingberger Gepardenforelle;-)
Die folgende Nachricht zum Thema stammt von: opi, 31. 12. 2005, 16:54
Hallo,
»» »» .button_submit a {
»» »» display:block;
»» »» margin:0 auto;
»» »» ...
»» »» }
»» »»
»» brauchst Du überhaupt dieses eine DIV?
natürlich. Ohne das div-Element könnte ich den Link nicht mittig
zentrieren, da margin:0 auto; nicht mit IE funktioniert.
Ich benötige sogar zwei DIV's.
1. DIV 100%, center
2. DIV Größe und Höhe des Image
3. Link
»» Und was den IE betrifft: der wendet text-align bekanntlich auch auf blocklevel-Elemente an.
margin:0 auto; war gemeint.
Greez,
opi
--
Selfcode: ie:( fl:( br:^ va:) ls:] fo:) rl:( n4:? ss:| de:] ch:? mo:|
Die folgende Nachricht zum Thema stammt von: Ingo Turski, 31. 12. 2005, 17:32
Hi,
»» »» brauchst Du überhaupt dieses eine DIV?
»»
»» natürlich. Ohne das div-Element könnte ich den Link nicht mittig
»» zentrieren, da margin:0 auto; nicht mit IE funktioniert.
»»
»» Ich benötige sogar zwei DIV's.
nö, zumindest sehe ich noch keinen Grund.
»» 1. DIV 100%, center
body {text-align:center;}
»» 2. DIV Größe und Höhe des Image
unnötig.
»» 3. Link
a {display:block; width:104px; margin:auto;}
»» »» Und was den IE betrifft: der wendet text-align bekanntlich auch auf blocklevel-Elemente an.
»»
»» margin:0 auto; war gemeint.
ich weiß. Im standardkompatiblen Mode kann der IE6 das auch umsezten und für die übrigen Fälle hilft dann text-align.
freundliche Grüße
Ingo
--
[barrierefreie Webseitenerstellung » Suchmaschinenoptimierung | em?] (Hommingberger Gepardenforelle;-)
© 1998-2006 
Impressum, Software: Classic Forum
(CSS)