aleborgMedlem sedan jan. 20012 962 inlägg
Sitter med en meny men det vill sig inte som jag vill:
https://windows.kontrollpanelen.se/test/html/
menyn till vänster rör på sig vid "hover", så här ser klassen ut:
A.Sub:hover {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color:#000000;
text-decoration: none;
border-style:solid;
border-width:1px;
border-color:#999999;
background-color:#F2F7FF;
display: block;
width: 95%;
height: 100%;
}
hur får man menyobjekten att vara still?
silfverMedlem sedan apr. 20039 709 inlägg
Eftersom det inte är några borders när man inte har musen över så kanske du borde göra så att det är borders även när man inte har musen över.
a.Sub {
border: 1px solid transparent;
}
Borde väl göra susen?
frankofMedlem sedan jan. 20014 275 inlägg
Det är väl inte så konstigt ;)
Du lägger ju till en border vid hoover, och den kräver ju lite plats.
Lägg till border även på a.sub, fast "osynlig"(transparent)
aleborgMedlem sedan jan. 20012 962 inlägg
Gislaved.netMedlem sedan juni 20001 274 inlägg
Det fungerar här i alla fall.
frankofMedlem sedan jan. 20014 275 inlägg
Är "a.sub" och "a.sub:hover" identiska frånsett border?
Saknas en "border-style:solid;" i "A.Sub:link"
aleborgMedlem sedan jan. 20012 962 inlägg
Så här ser det ut nu:
.Sub {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color:#000000;
text-decoration: none;
border-style:solid;
border-width:1px;
border-color:transparent;
background-color:transparent;
display: block;
width: 95%;
height: 100%;
}
A.Sub:link {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color:#000000;
text-decoration: none;
border-style:solid;
border-width:1px;
border-color:transparent;
background-color:transparent;
display: block;
width: 95%;
height: 100%;
}
A.Sub:visited {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color:#000000;
text-decoration: none;
border-style:solid;
border-width:1px;
border-color:transparent;
background-color:transparent;
display: block;
width: 95%;
height: 100%;
}
A.Sub:hover {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color:#000000;
text-decoration: none;
border-style:solid;
border-width:1px;
border-color:#999999;
background-color:#F2F7FF;
display: block;
width: 95%;
height: 100%;
}
A.Sub:active {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color:#000000;
text-decoration: none;
border-style:solid;
border-width:1px;
border-color:transparent;
background-color:#transparent;
display: block;
width: 95%;
height: 100%;
font-weight:bold;
}
och så här ser det ut nu:
https://windows.kontrollpanelen.se/test/html/
silfverMedlem sedan apr. 20039 709 inlägg
Funkar prima för mig. :)
(i Firefox)
Nu när jag kollade i IE så ser det riktigt annorlunda ut. Du borde ta en titt i Firefox, om du inte gjort det. Eller vise versa.
frankofMedlem sedan jan. 20014 275 inlägg
Ja, nu står dom still i moz åminstonde ;)
aleborgMedlem sedan jan. 20012 962 inlägg
aleborgMedlem sedan jan. 20012 962 inlägg
nu finns border hela tiden runt :(
silfverMedlem sedan apr. 20039 709 inlägg
aleborg skrev:
inte i IE6
I mitt IE6 står det still. :e
silfverMedlem sedan apr. 20039 709 inlägg
aleborg skrev:
nu finns border hela tiden runt :(
Ta en titt här.
r/ Men vaf*n. Länken strular. Validera din CSS så ser du felen. http://jigsaw.w3.org/css-validator/
frankofMedlem sedan jan. 20014 275 inlägg
Har inte med olika modes att göra då? (IE i "quirks" moz i "standard")
R: din css-fil innehåller även "<style type="text/css">
<!--
-->
</style>"
Onödigt (kan även störa(?)) tabort
TinwëlintMedlem sedan maj 2004478 inlägg
Om jag vill ha border på hover men inte annars brukar jag istället för att sätta en border med samma färg som bakgrunden eller så öka min margin (eller lägga till margin) såhär:
a {
padding: 5px;
margin: 10px;
background #999;
}
a:hover {
margin: 9px;
border: 1px solid #000;
}
Det är ju mycket bättre än att sätta en "osynlig" border.
aleborg, utan att ha testat så har jag fixat till din css lite. Det här blir samma sak som det du skrev innan:
a.sub {/*.sub låg ska väl bara ligga på a-elementet? */
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color:#000000;
text-decoration: none;
background-color: transparent;
display: block;
width: 95%;
height: 100%;
margin: 1px; /* håller plats åt bordern */
}
/* om man inte anger något för :link så blir det samma som man har satt på a.sub
samma sak gäller :visited, den ärvs från a.sub */
a.sub:hover {
border: 1px solid #999; /*sammandragning av de olika border-egenskaperna*/
background-color:#F2F7FF;
margin: 0px;
}
/*här räcker det att ange skillnaderna mot deklarationen av a.sub. Resten ärvs */
/*:active hade precis samma egenskaper som a.sub och behöver inte heller upprepas */
Hoppas att det fungerar.
Nexus86Medlem sedan okt. 20022 683 inlägg
[OT]
Hittade något annat roligt. :)
När man drar musen över "Change language" och sedan bort igen så växer den på höjden. Gör man det tillräckligt många ggr så blir den sketastor. :P
[/OT]