**Menü in *.css Datei, aktiver Link andersfarbig**

AltF4 · 24.03.2008, 00:44

Hallo zusammen,

ich möchte meine Homepage künftig mit typo3 verwalten. Dazu habe ich versucht das CSS Design der alten Homepage zu übernehmen. Leider komme ich nicht dahinter wie ich die CSS Datei ändern muß, damit der aktive Link im horizontalen Menü (#menuline) in einem andersfarbigen layer erscheint. Hier mal die CSS:

Code:

body {
	text-align:center;
	background:#3333FF;
}

#komplett {
	margin:10px auto;
	width:788px;
	text-align:left;
}

#header {
	height:100px;
	background:#9999FF;
}
#menuline {
	height:18px;
	background: #7777EE;
}
#left {
	width:140px;
        height:430px;
	color: #fff;
	background:#9999EE;
}
#content {
	float:left;
}
#footer {
	clear:left;
	background:#7777EE;
	color:#fff;
	height:16px;
        text-align:center;
}
/* topmenu */
#menuline{
margin:0;
padding:0;
border-top:1px solid black;
border-bottom:1px solid black;
text-align:center;}
#menuline ul{
background:#7777EE;
margin:0;
padding:5px;
list-style:none;
white-space: nowrap;}
#menuline li{
display:inline;}
#menuline a{
color:#000099;
background:#98bed1;
padding:2px 20px 2px 20px;
border:1px solid black;
font:bold 12px verdana, sans-serif;
text-decoration:none;
text-align:center;}
#menuline #akt {
color: #FFFFFF;
background-color: #FF0000;
}
#menuline a:hover{color:white;background:blue;}

/* leftmenu */
#left ul {
list-style:none;
font:10px verdana, sans-serif;
text-decoration:none;
margin-top:8px;
margin-bottom:16px;
padding-left:0px;
}
#left ul li {
padding-left:10px;
font:10px verdana, sans-serif;
text-decoration:none;
margin-bottom:8px;
}
#left ul li ul {
margin-bottom:10px;
font:10px verdana, sans-serif;
text-decoration:none;
margin-bottom:8px;
}

Der rot markierte Teil muß geändert werden, aber ich komm nicht drauf wie ich das ändern muß. Wäre schön wenn mir jemand unter die Arme greifen könnte.

MFG
AltF4

AltF4 · 24.03.2008, 09:35

vielleicht wäre eine Möglichket das über einen Eintrag wie:

Code:

#menuline a#current{
                   background: white;
                   border-bottom: 1px solid white;
                   }

zu machen? Aber wie muß dann das html Templat angepaßt werden?

Das sieht im Moment so aus:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>

  <link rel="stylesheet" href="../css/site.css" media="screen,projection">
  <title></title>


</head>


<body>

<!-- ###DOKUMENT### start -->
<div id="komplett">	
<div id="header">###LOGO###</div>

<div id="menuline">###TOPMENU###</div>

<div id="left">###LINKS###</div>

<div id="content">###INHALT###</div>

<div id="footer">###FOOTER###</div>

</div>

<!-- ###DOKUMENT### end -->
</body>
</html>

Gruß
AltF4

Rinaldo · 24.03.2008, 13:42

Vielleicht hilft Dir das weiter: Ausgewählte Seite in einer Navigation hervorheben.

AltF4 · 24.03.2008, 16:34

Hallo Rinaldo,

leider komm ich mit den Hilfestellungen auf dieser Seite auch nicht weiter. Vielleicht habe ich das Problem auch nicht richtig formuliert.

Auf der alten Homepage wurde id="akt" immer an dem jeweiligen Menüpunkt mit eingefügt, so das CSS wußte das hier was gestaltet werden soll.

Jetzt in Typo3 werden die Seiten per PHP aus einem HTML Templat, einer CSS Datei und dem Content aus der Datenbank generiert. Ich steig jetzt nicht dahinter, wie CSS sage das es die zuletzt aufgerufene Seite im Menü mit andersfarbigem Hintergrund darstellen soll.

Gruß
AltF4

AltF4 · 24.03.2008, 20:33

Hallo,

ich habs gelöst. Die id für die aktive Seite wird vom root Templat bereit gestellt. Manchmal sieht man den Wald vor lauter Bäumen nicht.

Gruß
AltF4