nicht angemeldet
Probleme mit a:hover
0 0 -1 0 0 0 0 
MudGuard
Probleme mit a:hover
Hallo zusammen
versuche mich ein erstes mal an einem "mouse over effekt" - falls man es überhaupt so nennen kann, da das ja dann ein js wäre und nicht css, oder? ;)
jedenfalls sieht die sache so aus: in jeder zelle meiner tabelle ist ein link vorhanden
<table width="900" height="75" border="0" id="menu"><tr>
<td width="20"> </td>
<td width="110"><a href="-">Startseite</a></td>
<td width="110">2</td>
<td width="110">3</td>
<td width="110">4</td>
<td width="110">5</td>
<td width="110">6</td>
td width="220"> </td>
</tr></table>
wenn man nun über einen link fährt, soll die ganze zelle in ihrem ausmaß von 110*75 die hintergrundfarbe ändern. leider ändert sich bei mir nur der teil in dem der text steht, wenn ich background-color benutze.
kann mir jemand sagen, wie ich das richtig mache?
Vielen Dank für eure Hilfe
-
hi,
jedenfalls sieht die sache so aus: in jeder zelle meiner tabelle ist ein link vorhanden
Du meinst, in der ersten Zelle einer Zeile?
wenn man nun über einen link fährt, soll die ganze zelle in ihrem ausmaß von 110*75 die hintergrundfarbe ändern. leider ändert sich bei mir nur der teil in dem der text steht, wenn ich background-color benutze.
kann mir jemand sagen, wie ich das richtig mache?
Bringe den Link auf Zellengröße.
display:block und ggf. width und height.gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }-
Du meinst, in der ersten Zelle einer Zeile?
nein, in jeder zelle dieser einen zeile. habe die weiteren links nur mit 2, 3, ... benannt und das a href entfernt. wenn man jedoch vom bsp ausgeht dann "in der ersten Zelle einer Zeile" ;)
es klappt, vielen dank für eure schnellen antworten.
noch ne schöne woche
gruß, martin
-
-
Hallo Martin.
jedenfalls sieht die sache so aus: in jeder zelle meiner tabelle ist ein link vorhanden
<table width="900" height="75" border="0" id="menu"><tr>
<td width="20"> </td>
<td width="110"><a href="-">Startseite</a></td>
<td width="110">2</td>
<td width="110">3</td>
<td width="110">4</td>
<td width="110">5</td>
<td width="110">6</td>
td width="220"> </td>
</tr></table>Der Begriff „Startseite“ deutet darauf hin, dass du hier keine Tabelle sondern eine Liste verwenden möchtest. Diese können natürlich auch formatiert werden.
wenn man nun über einen link fährt, soll die ganze zelle in ihrem ausmaß von 110*75 die hintergrundfarbe ändern. leider ändert sich bei mir nur der teil in dem der text steht, wenn ich background-color benutze.
kann mir jemand sagen, wie ich das richtig mache?
Formatiere den standarmäßig als Inline gesetzten Link als Block.
Das Vorgehen ist bei der Liste identisch.Einen schönen Dienstag noch.
Gruß, Ashura
--
sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
„It is required that HTML be a common language between all platforms. This implies no device-specific markup, or anything which requires control over fonts or colors, for example. This is in keeping with the SGML ideal.“
[HTML Design Constraints: Logical Markup] -
Hallo
Der Grundsatz stimmt.
Nun die Hintergrundfarbe musst du über den Link Tag (a / a:hover) definieren, mittels display: block; wird der Link Tag über die ganze Zelle gelegt:
BSW:
a.nav{
font-size: 11px;
color: #054C84;
font-style: normal;
line-height: 20px;
font-weight: bold;
font-variant: normal;
text-decoration: none;
text-transform: none;
background-color: #F08080;
width: 110px;
height: 10px;
display: block;
}
a.nav:hover{
background-color: #FFFFFF;
}Gruss
-
es gibt doch noch ein Problem ... :-(
soweit hat alles ganz gut geklappt. leider werden jetzt die links am oberen rande der tabelle angezeigt - als hätte ich irgendwo text-align:top eingefügt. dem ist aber nicht so.
habe es bereits mit text-align:middle versucht, was jedoch überhaupt nicht hilft und mit padding-top, was zwar hilft, mir aber meine tabelle in der höhe verzieht, bzw vergrößert und zwar genau um den wert, den ich bei padding eingebe.
kann ich da noch was anderes versuchen?
gruß, martin
-
hi,
leider werden jetzt die links am oberen rande der tabelle angezeigt - als hätte ich irgendwo text-align:top eingefügt. dem ist aber nicht so.
habe es bereits mit text-align:middle versucht, was jedoch überhaupt nicht hilft
Oh Wunder - das gibt es ja auch gar nicht.
Du meinst vielleicht vertical-align - für die Tabellenzelle.kann ich da noch was anderes versuchen?
Alternative wäre eine entsprechend große line-height für die Links - taugt aber nur dann, wenn deren Textinhalte extrem kurz sind, so dass sie nicht in mehrere Zeilen umgebrochen werden.
gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }-
habe es bereits mit text-align:middle versucht, was jedoch überhaupt nicht hilft
Oh Wunder - das gibt es ja auch gar nicht.
Du meinst vielleicht vertical-align - für die Tabellenzelle.ähm, ja - genau :D
Alternative wäre eine entsprechend große line-height für die Links - taugt aber nur dann, wenn deren Textinhalte extrem kurz sind, so dass sie nicht in mehrere Zeilen umgebrochen werden.
ich weiß zwar nicht was line-height damit zu tun hat, besonders dann nicht wenn ich da 65px angeben muss um den text bei einer 75px großen zelle vertival mittig auszurichten, aber was solls ... es funktioniert nämlich oO
vielen vielen dank
-
Hi,
Oh Wunder - das gibt es ja auch gar nicht.
Du meinst vielleicht vertical-align - für die Tabellenzelle.Wie wärs mit vertical-align und display:table-cell für das a?
Zumindest in Browsern sollte das doch funktionieren ...cu,
Andreas--
Warum nennt sich Andreas hier MudGuard?
Schreinerei Waechter
O o ostern ...
Fachfragen unaufgefordert per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
-
-