nr1
Here to stay
|
Es geht darum Links mit CSS zu formatieren. Kenne mich damit aus, und habe schon das gewünschte Ergebnis, allerdings wird dieses (wie so oft) nur von einem Browser richtig dargestellt, in diesem Fall IEXplorer. <style type="text/css">
a:link
{color: FFFFFF;}
a:active {color: FFFFFF;}
a:visited {color: FFFFFF;}
a:hover
{
color: gray;
background-color:rgb(37,39,44);
width:100%;
font-weight:bold;
}
</style>
Das ist der Code. Beim hovern über einen Link, soll die ganze Zeile des links anders eingefärbt werden (background-color:rgb(37,39,44) ![;)](/images/smilies/wink.gif) . "width:100%;" ist dazu da, dass der eingefärbte Bereich auch wirklich über die ganze Breite geht. Dies funzt im IExplorer alles ohne Probleme, im Firefox wird jedoch nur der Bereich des "wirkliche" Links eingefärbt, und nicht auch die restliche Zeile. Tipps?
|
that
Hoffnungsloser Optimist
|
Inline-Elemente werden nicht auf die ganze Zeilenbreite verbreitert. Probier "display:block".
|
nr1
Here to stay
|
Inline-Elemente werden nicht auf die ganze Zeilenbreite verbreitert. Probier "display:block". hab ich probiert, damit funzts es jetzt in beiden browsern (FF,IEXplorer), allerdings wird dann unter dem Link ein leerer Bereich generiert, und alles andere daher nach unten geschoben
|
that
Hoffnungsloser Optimist
|
Kann ich nicht nachvollziehen, bitte poste ein komplettes HTML-File, reduziert auf dein Problem.
|
nr1
Here to stay
|
ok hier mal der code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<style type="text/css">
a:link
{color: FFFFFF;}
a:active {color: FFFFFF;}
a:visited {color: FFFFFF;}
a:hover
{
color: gray;
background-color:rgb(37,39,44);
font-weight:bold;
<?--Hier muss irgendwas rein, damit das einfärben der Zeile bei beiden Browsern funzt ->
}
</style>
</head>
<body bgcolor=#333333 text="#FFFFFF" link="#FFFFFF" vlink="#FFFFFF" alink="#FFFFFF">
<font face="verdana" size="2">
<table style="text-align: left; width: 100%;" border="0" cellpadding="0" cellspacing="0">
<tr>
<td bgcolor="black" align="center"><font face="verdana" color="#ffffff" size="2">.:NAVI:.</font></td>
</tr>
</table>
<a href="file:///irgendeins" target="content">> Home</a><br>
<a href="file:///irgendeins" target="content">> Home</a><br>
<a href="file:///irgendeins" target="content">> Home</a><br>
<a href="file:///irgendeins" target="content">> Home</a><br>
<a href="file:///irgendeins" target="content">> Home</a><br>
<a href="file:///irgendeins" target="content">> Home</a><br>
</font>
</body>
</html>
Wie gesagt, es geht eigentlich nur drum, den Hintergrund der Zeile in dem der Link steht einzüfärben (auf die ganze Breite)
|
that
Hoffnungsloser Optimist
|
Jo mei, wenn dich der Zeilenabstand stört, dann tu halt das <br> weg. ![:D](/images/smilies/biggrin.gif) Und du solltest das <font> und die Farb-Attribute ins CSS migrieren.
|
nr1
Here to stay
|
Jo mei, wenn dich der Zeilenabstand stört, dann tu halt das <br> weg. ![:D](/images/smilies/biggrin.gif) Ähm ja, danke für die Hilfe, nur wäre das leider ein wenig unsinnig Und du solltest das <font> und die Farb-Attribute ins CSS migrieren.
Das weiß ich eh, ist nur mal ein Versuchs-Beispiel
|
that
Hoffnungsloser Optimist
|
Ähm ja, danke für die Hilfe, nur wäre das leider ein wenig unsinnig Hm? Ich dachte, dich stört allerdings wird dann unter dem Link ein leerer Bereich generiert, und alles andere daher nach unten geschoben ?
|
nr1
Here to stay
|
@that: probier mal meinen geposteten code, und gib bei dem hover effekt dein 'display:block;' dazu, dann wirst du sehen, was das problem ist
|
ica
hmm
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<style type="text/css">
a:link
{color: FFFFFF;display:block;}
a:active {color: FFFFFF;display:block;}
a:visited {color: FFFFFF;display:block;}
a:hover
{
color: gray;
background-color:rgb(37,39,44);
font-weight:bold;
display:block;
}
</style>
</head>
<body bgcolor=#333333 text="#FFFFFF" link="#FFFFFF" vlink="#FFFFFF" alink="#FFFFFF">
<font face="verdana" size="2">
<table style="text-align: left; width: 100%;" border="0" cellpadding="0" cellspacing="0">
<tr>
<td bgcolor="black" align="center"><font face="verdana" color="#ffffff" size="2">.:NAVI:.</font></td>
</tr>
</table>
<a href="file:///irgendeins" target="content">> Home</a>
<a href="file:///irgendeins" target="content">> Home</a>
<a href="file:///irgendeins" target="content">> Home</a>
<a href="file:///irgendeins" target="content">> Home</a>
<a href="file:///irgendeins" target="content">> Home</a>
<a href="file:///irgendeins" target="content">> Home</a>
</font>
</body>
</html>
|
nr1
Here to stay
|
@iCA-: thx so funzts
|
murcielago
Dr. Doom
|
und warum funzts? weil das <br> weg ist. ![:bash:](/images/smilies/bash.gif) LESEN!
|
nr1
Here to stay
|
und warum funzts? weil das <br> weg ist. ![:bash:](/images/smilies/bash.gif)
LESEN! Nein, sondern weil ICA- bei jeder Link Definition "display:block;" dabei hat, ich das aber nur beim hover hatte. Das ist auch der Grund warum man jetzt das "<br>" weglassen kann. LESEN!
|
murcielago
Dr. Doom
|
Nein, sondern weil ICA- bei jeder Link Definition "display:block;" dabei hat, ich das aber nur beim hover hatte. Das ist auch der Grund warum man jetzt das "<br>" weglassen kann.
LESEN! ![;)](/images/smilies/wink.gif) alles was "that" gepostet hat, war richtig. du hast es nur falsch umgesetzt, aber behauptet dass es sinnfrei wäre, das einzubauen was er vorgeschlagen hatte (eben das "<br>" zu entfernen).
|
nr1
Here to stay
|
wie auch immer, auf jeden fall funzts jetzt
|