Kleines "a:link" Problem mit Border

  • Themenstarter Themenstarter fjordblauer
  • Beginndatum Beginndatum
Status
Nicht offen für weitere Antworten.
F

fjordblauer

Hi,

wenn ich mit der Maus über den Link fahre, vergrößert sich der Layer durch den Border. Stört in einem großem Menü natürlich gewaltig. Wie kann ich das abstellen? ;-)

Vielen Dank schonmal!

Hier der HTML Code:

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 "http://www.w3.org/TR/xhtml1/DTD/Strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">

<head>

	<title>WOBCOM GmbH: Telefonie - Internet - Datenleitungen</title>
	<link rel="stylesheet" type="text/css" href="format/format.css" />

</head>

<body>

<div id="left_frame_menue_Div">

						<div class="left_frame_menue_title">Home
						
						</div>
						
						<span class="left_frame_menue_endbox">
						
							<a class="leftmenue" href="index.php?section=privatkunden">&raquo; Privatkunden</a>
							<a class="leftmenue" href="index.php?section=geschaeftskunden">&raquo; Geschäftskunden</a>
							<a class="leftmenue" href="index.php?section=service">&raquo; Service</a>
							<a class="leftmenue" href="index.php?section=unternehmen">&raquo; Unternehmen</a>				
														
						</span>
						
</div>

</body>

</html>

Und hier der CSS Code:

Code:
.left_frame_menue_title 	{
								float:left; line-height:20px; margin-bottom:5px; background-color:#007a63; border:1px solid #000000; color:#ffffff; padding-left:2px; padding-right:2px; width:174px;
							}

.left_frame_menue_box		{
								float:left; line-height:20px; margin-bottom:5px; background-color:#f0f0f0; border:1px solid #000000; color:#000000; padding-left:2px; padding-right:2px; margin-top:0px; width:174px;
							}

.left_frame_menue_endbox	{
								float:left; line-height:20px; margin-bottom:15px; background-color:#f0f0f0; border:1px solid #000000; color:#000000; padding:2px; margin-top:0px; width:174px;
							}

a.leftmenue:link { text-decoration:none; color:#000000; font-size: 12px; display:block; display: block;}

a.leftmenue:visited { text-decoration:none; color:#000000; font-size: 12px; display: block;}

a.leftmenue:hover { text-decoration:none; color:#000000; font-size: 12px; display: block; border: 1px solid #000000; background-color: #ffffff;}

a.leftmenue:active { text-decoration:none; color:#000000; font-size: 12px; display: block;}

fjordblauer
 
Hi,

gib doch den Links mit den anderen Pseudoklassen (link, visited und active) auch einen Rahmen,
allerdings mit der Hintergrundfarbe als Rahmenfarbe.
Code:
a:PSEUDOKLASSE{ /* bisherige CSS-Definitionen*/
                 border: 1px solid #f0f0f0;}
Ciao
Quaese
 
Du könntest z. B. die Höhe festlegen und diese dann für das Überfahren um zwei Pixel verringern:
HTML:
a.leftmenue:link { text-decoration:none; color:#000000; font-size:12px; display:block; height:20px; }

[...]

a.leftmenue:hover { text-decoration:none; color:#000000; font-size:12px; display:block; border:1px solid #000000; background-color:#ffffff; height:18px; }
Desweiteren würde ich dir empfehlen, die Schriftgrösse nicht in Pixel, sondern in relativen Einheiten (% oder em) anzugeben, sonst kann man sie im IE nicht vergrössern/verkleinern.
 
SUPER!

Danke Euch!

Quaese, glaube langsam muss ich dir mal nen Bier per Deutsche Post schicken... ;-)
 
Zuletzt bearbeitet von einem Moderator:
Desweiteren würde ich dir empfehlen, die Schriftgrösse nicht in Pixel, sondern in relativen Einheiten (% oder em) anzugeben,
Das dachte ich auch mal, aber komischer Weise funktioniert das trotzdem...?!
 
Status
Nicht offen für weitere Antworten.
Zurück