Suche im Forum:
Suchen


« Vorheriges Thema anzeigen :: Nächstes Thema anzeigen »  
Autor Nachricht
Beitrag23.09.2009 um 18:44 (UTC)    
Titel: CSS-Design Hintergrund des aktiven, gewählten Menübuttons

Hallo.

Ich habe seit heute ein neues Design.
www.jens-hp-service.de.tl

Wenn ihr die Homepage aufruft, seht ihr, dass der "Home" Button mit einem schicken, grünen Hintergrund Bild hinterlegt ist.

Rufe ich jetzt allerdings die anderen Menüs auf, also klicke ich auf einen anderen Menüpunkt, bleibt dieser grüne Button leider weiterhin auf "Home".

Wie bekomme ich es hin, dass sich der Hintergrund des Menüpunktes ändert, das ich soeben angeklickt habe ?

Ich schreibe mal meinen Code hier mit rein.
CSS-Code ohne Style Tags:

#extraDiv1 {display: none;}
#extraDiv2 {display: none;}
#extraDiv3 {display: none;}
#extraDiv4 {display: none;}
#extraDiv5 {display: none;}
#extraDiv6 {display: none;}
#pre_header {display: none;}
#post_header {display: none;}
#pre_content {display: none;}
#nav_heading{display: none;}
#nav{display: none;}
div.header{display: none;}
h1#title{display: none;}
h2#title span {display: none;}


* { padding:0; margin:0;
}
.clear {clear:both;}
a {
color: #5B920A;
}

body {background:#fff url(http://www.loaditup.de/files/405485.jpg) repeat-x; font: 11px

Verdana, Arial, Helvetica, sans-serif; color:#333;}
#wrap {width:954px; margin:25px auto;}
#header {background:url(http://www.loaditup.de/files/405514.png) no-repeat;

height:207px; }
#logo #sitename {
font-size: 36px;
color: #000000;
display: block;
text-align: center;
padding-top: 5px;
padding-bottom: 5px;
border-bottom: 1px solid #C6C6C6;
}
#headercontent h2 {
font-size: 18px;
color: #5B920A;
}
#wrap #header #logo .description {
display: block;
text-align: center;
font-size: 16px;
padding-top: 10px;
}
#wrap #header #headercontent p {
color: #666666;
}
#wrap #header #sitecption {
margin-right: 380px;
margin-left: 380px;
padding-top: 85px;
color: #FFFFFF;
font: bold 16px "Trebuchet MS", halvetica, Verdana, sans-serif;
}
.bigger {
font: 18px "Trebuchet MS", halvetica, Verdana, sans-serif;
color: #C0EC15;
}


#wrap #header #logo {
width: 260px;
padding-top: 50px;
padding-left: 50px;
height: 150px;
float: left;
}
#wrap #header #headercontent {
width: 300px;
float: right;
padding-right: 55px;
padding-top: 60px;
height: 125px;
}


#main {background:url(http://www.loaditup.de/files/405489.png) repeat-y; height:900px; padding:2px

9px 0 9px; margin:0;}
#menus {background:url(http://www.loaditup.de/files/405520.jpg) no-repeat;

width:936px; margin:0 auto 10px auto; height:88px;}#submenu ul {
list-style: none;
}
#submenu li {
display: inline;
}
#submenu a {
background: url() no-repeat left;
display: block;
float: left;
height: 16px;
padding-top: 2px;
padding-right: 15px;
padding-left: 15px;
color: #666666;
text-decoration: none;
}
#mainmenu {
height: 55px;
font: bold 14px "Trebuchet MS", halvetica, Verdana, sans-serif;
text-decoration: none;
text-transform: uppercase;
padding-top: 10px;
padding-right: 22px;
padding-left: 22px;
}
#mainmenu a {
display: block;
height: 40px;
padding-right: 25px;
padding-left: 25px;
float: left;
text-decoration: none;
padding-top: 15px;
background: url(http://www.loaditup.de/files/405492.png) no-repeat 0px 3px;
color: #5B920A;
}
#mainmenu .first a {
background: none;
}

#mainmenu li {
display: inline;
}
#mainmenu a:visited, #mainmenu a:active {text-decoration:none; color: #5B920A;}
#mainmenu #active a {background:url(http://www.loaditup.de/files/405493.gif)

no-repeat center top; color:#fff;}
#wrap #main #content {
padding: 10px;
}
#mainmenu a:hover {color:#fff; background: url(http://www.loaditup.de/files/405493.gif);}
#homeleft {width:480px; float:left;}
#homeright { margin-left:500px; }
h1, h2, h3, h4 { font-family:"Trebuchet MS", halvetica, Verdana, sans-serif;}
h1 {font-size:22px;}
h2 {font-size:18px;}
h3 {font-size:16px;}
h4 {font-size:14px;}
#main h2 {color:#333; display:block; padding:3px 0 8px 0;}
.green {
color: #5B920A;
}
#homeright h3 {
color: #5B920A;
font-weight: normal;
font-size: 14px;
margin-top: 5px;
margin-bottom: 8px;
}
#main p {
line-height: 16px;
margin-bottom: 18px;
}
#homeright .column1 {
width: 31%;
float: left;
padding-right: 5px;
}
#homeright .column3 {
float: left;
width: 32%;
padding-left: 8px;
}
#homeright .column2 {
float: left;
width: 33%;
}
a:visited, a:active {
color: #5B920A;

}

a:hover {
color: #BDEB16;
text-decoration: none;
}
#wrap #footer {
background: url(http://www.loaditup.de/files/405494.png) no-repeat;
height: 70px;
padding-top: 15px;
text-align: center;
color: #666666;
}
#mainmenu ul {list-style:none;}
#submenu a:visited, #submenu a:active {
background: url(background: url(); no-repeat left;
display: block;
float: left;
height: 16px;
padding-top: 2px;
padding-right: 15px;
padding-left: 15px;
color: #666666;
text-decoration: none;
}
#submenu a:hover {

background: url() no-repeat left;
display: block;
float: left;
height: 16px;
padding-top: 2px;
padding-right: 15px;
padding-left: 15px;
color: #000000;
text-decoration: none;
}
#mainmenu .first a:visited, #mainmenu .first a:active {

background: url(http://www.loaditup.de/files/405493.gif);
}
#productlist {
list-style: none;
}
#productlist li {
display: block;
padding: 3px;
border-bottom: 1px solid #eee;
}
.productimage {
float: left;
}
.post .date {
font-size: 10px;
}
.post h3 {
font-size: 14px;
text-transform: uppercase;
display: block;
margin-bottom: 15px;
}
.post {
padding: 5px;
margin-bottom: 15px;
}
#sidebar1 {
float: left;
width: 49%;
}
#sidebar2 {
float: right;
width: 49%;
}
#homeright ul {
list-style: none;
}
#homeright li {
display: block;
border-bottom: 1px solid #eee;
height: 18px;
}
#homeright li a {
display: block;
height: 15px;
padding-top: 2px;
color: #999999;
text-decoration: none;
background: url(http://www.loaditup.de/files/405497.png) no-repeat 0px 3px;
padding-left: 15px;
}

.form {margin:10px 25px 10px 50px;}
.form .text {
display:block;
border:1px solid #666666;
background: #efefef;
width:250px;
padding:5px;
font-size:14px;
color:#000000;
}
.form label {display:block; margin-bottom:3px; margin-top:10px;}
.form .text:hover{background:#FFFFFF; border: solid 1px #000000;}
.form .text:focus {
background:#efefef;
border: 1px solid #669900;
}
.form .button {
display:block;
border:1px solid #666666;
background:#efefef;
padding:5px 10px 5px 10px;
margin:10px 0px 10px 0px;
}
.form .button:hover {
display:block;
border:1px solid #666666;
background: #ffffff;
padding:5px 10px 5px 10px;
margin:10px 0px 10px 0px;
}

#content {
position: absolute;
left: 50%;
top:440px;
margin-left:-440px;
width: 600px;
height: 760px;
padding:10px;
color: #000000;
font-size: 14px;
font-family: Arial;
background-color:#transparent;
background-image:url();
border: 0px solid #C1F3C3;
overflow:auto;
}

Gruß,
jens Very Happy

Achja, bevor ich´s vergesse. Ich habe im Forum lange gesucht, und hier und da was gefunden, aber das hat nie geklappt. Aber das, was ich jetzt mit BLAU hinterlegt habe, das sollte dafür doch eigentlich zuständig sein, oder ?
______________


Zuletzt bearbeitet von jens-hp-service am 22.11.2009, 19:44, insgesamt 2-mal bearbeitet
Beitrag23.09.2009 um 18:51 (UTC)    
Titel:

Sieht auch falsch aus das hier :
Zitat:
#mainmenu #active a {background:url(http://www.loaditup.de/files/405493.gif)


Probier mal :
Zitat:
#mainmenu a:active {background:url(http://www.loaditup.de/files/405493.gif)


Es sollte eigentlich "a:active" heißen,
das es ja auch "link a:hover" oder anderes, heißt.

"#active a" ist falsch. Denn dann wäre Active eine Klasse,
was es nicht ist.


Zuletzt bearbeitet von homepage-vergleich am 23.09.2009, 19:53, insgesamt einmal bearbeitet
Beitrag23.09.2009 um 18:58 (UTC)    
Titel:

Danke für die schnelle Antwort.

Es wäre aber zu schön gewesen, um wahr zu sein.

Leider funktioniert es nicht.
Ich habe es so eingesetzt wie du gesagt hast, doch dann hatte ich den grünen Button nur noch als Hover und er wurde auch bei HOME nicht mehr angezeigt. Neutral Hm...eigentlich gibts zu jedem Problem auch ne Lösung xD Laughing Very Happy
Beitrag23.09.2009 um 19:04 (UTC)    
Titel:

Habe noch einen Fehler gemacht,
den du auch gemacht hast.

Am Ende der Style Anweisung muss ein ";".
Außerdem fehlte das "-image" bei "background".

Zitat:
#mainmenu a:active {
background-image:url(http://www.loaditup.de/files/405493.gif);}


Jetzt könnte es gehen.


Zuletzt bearbeitet von homepage-vergleich am 23.09.2009, 20:06, insgesamt 3-mal bearbeitet
Beitrag23.09.2009 um 19:07 (UTC)    
Titel:

homepage-vergleich hat Folgendes geschrieben:
Habe noch einen Fehler gemacht,
den du auch gemacht hast.

Am Ende der Style Anweisung muss ein ";".

Zitat:
#mainmenu a:active {
background-image:url(http://www.loaditup.de/files/405493.gif);}


Jetzt könnte es gehen.


funktioniert leider auch nicht. Sad Finde ich irgendwie komisch.

Aber a:active ist doch dafür zuständig, oder bin ich völlig an der falschen Stelle ?
Kann doch eigentlich nicht so schwer sein, einen ausgewählten Button mit einem Hintergrund zu vershen Very Happy Very Happy Very Happy

oder kann es was hiermit zu tun haben ?


#mainmenu .first a:visited, #mainmenu .first a:active {

background: url(http://www.loaditup.de/files/405493.gif);
}


Zuletzt bearbeitet von jens-hp-service am 23.09.2009, 20:10, insgesamt einmal bearbeitet
Beitrag23.09.2009 um 19:14 (UTC)    
Titel:

Habe mal den ganzen Code gemacht,
so sollte es gehen.


Zitat:
#extraDiv1 {display: none;}
#extraDiv2 {display: none;}
#extraDiv3 {display: none;}
#extraDiv4 {display: none;}
#extraDiv5 {display: none;}
#extraDiv6 {display: none;}
#pre_header {display: none;}
#post_header {display: none;}
#pre_content {display: none;}
#nav_heading{display: none;}
#nav{display: none;}
div.header{display: none;}
h1#title{display: none;}
h2#title span {display: none;}


* { padding:0; margin:0;
}
.clear {clear:both;}
a {
color: #5B920A;
}

body {background:#fff url(http://www.loaditup.de/files/405485.jpg) repeat-x; font: 11px

Verdana, Arial, Helvetica, sans-serif; color:#333;}
#wrap {width:954px; margin:25px auto;}
#header {background:url(http://www.loaditup.de/files/405514.png) no-repeat;

height:207px; }
#logo #sitename {
font-size: 36px;
color: #000000;
display: block;
text-align: center;
padding-top: 5px;
padding-bottom: 5px;
border-bottom: 1px solid #C6C6C6;
}
#headercontent h2 {
font-size: 18px;
color: #5B920A;
}
#wrap #header #logo .description {
display: block;
text-align: center;
font-size: 16px;
padding-top: 10px;
}
#wrap #header #headercontent p {
color: #666666;
}
#wrap #header #sitecption {
margin-right: 380px;
margin-left: 380px;
padding-top: 85px;
color: #FFFFFF;
font: bold 16px "Trebuchet MS", halvetica, Verdana, sans-serif;
}
.bigger {
font: 18px "Trebuchet MS", halvetica, Verdana, sans-serif;
color: #C0EC15;
}


#wrap #header #logo {
width: 260px;
padding-top: 50px;
padding-left: 50px;
height: 150px;
float: left;
}
#wrap #header #headercontent {
width: 300px;
float: right;
padding-right: 55px;
padding-top: 60px;
height: 125px;
}


#main {background:url(http://www.loaditup.de/files/405489.png) repeat-y; height:900px; padding:2px

9px 0 9px; margin:0;}
#menus {background:url(http://www.loaditup.de/files/405520.jpg) no-repeat;

width:936px; margin:0 auto 10px auto; height:88px;}#submenu ul {
list-style: none;
}
#submenu li {
display: inline;
}
#submenu a {
background: url() no-repeat left;
display: block;
float: left;
height: 16px;
padding-top: 2px;
padding-right: 15px;
padding-left: 15px;
color: #666666;
text-decoration: none;
}
#mainmenu {
height: 55px;
font: bold 14px "Trebuchet MS", halvetica, Verdana, sans-serif;
text-decoration: none;
text-transform: uppercase;
padding-top: 10px;
padding-right: 22px;
padding-left: 22px;
}
#mainmenu a {
display: block;
height: 40px;
padding-right: 25px;
padding-left: 25px;
float: left;
text-decoration: none;
padding-top: 15px;
background: url(http://www.loaditup.de/files/405492.png) no-repeat 0px 3px;
color: #5B920A;
}
#mainmenu .first a {
background: none;
}

#mainmenu li {
display: inline;
}
#mainmenu a:active {
background-image:url(http://www.loaditup.de/files/405493.gif);}

#mainmenu a:visited {
background-image:url(http://www.loaditup.de/files/405493.gif);}


no-repeat center top; color:#fff;}
#wrap #main #content {
padding: 10px;
}
#mainmenu a:hover {color:#fff; background: url(http://www.loaditup.de/files/405493.gif);}
#homeleft {width:480px; float:left;}
#homeright { margin-left:500px; }
h1, h2, h3, h4 { font-family:"Trebuchet MS", halvetica, Verdana, sans-serif;}
h1 {font-size:22px;}
h2 {font-size:18px;}
h3 {font-size:16px;}
h4 {font-size:14px;}
#main h2 {color:#333; display:block; padding:3px 0 8px 0;}
.green {
color: #5B920A;
}
#homeright h3 {
color: #5B920A;
font-weight: normal;
font-size: 14px;
margin-top: 5px;
margin-bottom: 8px;
}
#main p {
line-height: 16px;
margin-bottom: 18px;
}
#homeright .column1 {
width: 31%;
float: left;
padding-right: 5px;
}
#homeright .column3 {
float: left;
width: 32%;
padding-left: 8px;
}
#homeright .column2 {
float: left;
width: 33%;
}
a:visited, a:active {
color: #5B920A;

}

a:hover {
color: #BDEB16;
text-decoration: none;
}
#wrap #footer {
background: url(http://www.loaditup.de/files/405494.png) no-repeat;
height: 70px;
padding-top: 15px;
text-align: center;
color: #666666;
}
#mainmenu ul {list-style:none;}
#submenu a:visited, #submenu a:active {
background: url(background: url(); no-repeat left;
display: block;
float: left;
height: 16px;
padding-top: 2px;
padding-right: 15px;
padding-left: 15px;
color: #666666;
text-decoration: none;
}
#submenu a:hover {

background: url() no-repeat left;
display: block;
float: left;
height: 16px;
padding-top: 2px;
padding-right: 15px;
padding-left: 15px;
color: #000000;
text-decoration: none;
}
#mainmenu .first a:visited, #mainmenu .first a:active {

background: url(http://www.loaditup.de/files/405493.gif);
}
#productlist {
list-style: none;
}
#productlist li {
display: block;
padding: 3px;
border-bottom: 1px solid #eee;
}
.productimage {
float: left;
}
.post .date {
font-size: 10px;
}
.post h3 {
font-size: 14px;
text-transform: uppercase;
display: block;
margin-bottom: 15px;
}
.post {
padding: 5px;
margin-bottom: 15px;
}
#sidebar1 {
float: left;
width: 49%;
}
#sidebar2 {
float: right;
width: 49%;
}
#homeright ul {
list-style: none;
}
#homeright li {
display: block;
border-bottom: 1px solid #eee;
height: 18px;
}
#homeright li a {
display: block;
height: 15px;
padding-top: 2px;
color: #999999;
text-decoration: none;
background: url(http://www.loaditup.de/files/405497.png) no-repeat 0px 3px;
padding-left: 15px;
}

.form {margin:10px 25px 10px 50px;}
.form .text {
display:block;
border:1px solid #666666;
background: #efefef;
width:250px;
padding:5px;
font-size:14px;
color:#000000;
}
.form label {display:block; margin-bottom:3px; margin-top:10px;}
.form .text:hover{background:#FFFFFF; border: solid 1px #000000;}
.form .text:focus {
background:#efefef;
border: 1px solid #669900;
}
.form .button {
display:block;
border:1px solid #666666;
background:#efefef;
padding:5px 10px 5px 10px;
margin:10px 0px 10px 0px;
}
.form .button:hover {
display:block;
border:1px solid #666666;
background: #ffffff;
padding:5px 10px 5px 10px;
margin:10px 0px 10px 0px;
}

#content {
position: absolute;
left: 50%;
top:440px;
margin-left:-440px;
width: 600px;
height: 760px;
padding:10px;
color: #000000;
font-size: 14px;
font-family: Arial;
background-color:#transparent;
background-image:url();
border: 0px solid #C1F3C3;
overflow:auto;
}
Beitrag23.09.2009 um 19:23 (UTC)    
Titel:

homepage-vergleich hat Folgendes geschrieben:
Sorry war ein Fehler drin, jetzt sollte es gehen.

Zitat:
#extraDiv1 {display: none;}
#extraDiv2 {display: none;}
#extraDiv3 {display: none;}
#extraDiv4 {display: none;}
#extraDiv5 {display: none;}
#extraDiv6 {display: none;}
#pre_header {display: none;}
#post_header {display: none;}
#pre_content {display: none;}
#nav_heading{display: none;}
#nav{display: none;}
div.header{display: none;}
h1#title{display: none;}
h2#title span {display: none;}


* { padding:0; margin:0;
}
.clear {clear:both;}
a {
color: #5B920A;
}

body {background:#fff url(http://www.loaditup.de/files/405485.jpg) repeat-x; font: 11px

Verdana, Arial, Helvetica, sans-serif; color:#333;}
#wrap {width:954px; margin:25px auto;}
#header {background:url(http://www.loaditup.de/files/405514.png) no-repeat;

height:207px; }
#logo #sitename {
font-size: 36px;
color: #000000;
display: block;
text-align: center;
padding-top: 5px;
padding-bottom: 5px;
border-bottom: 1px solid #C6C6C6;
}
#headercontent h2 {
font-size: 18px;
color: #5B920A;
}
#wrap #header #logo .description {
display: block;
text-align: center;
font-size: 16px;
padding-top: 10px;
}
#wrap #header #headercontent p {
color: #666666;
}
#wrap #header #sitecption {
margin-right: 380px;
margin-left: 380px;
padding-top: 85px;
color: #FFFFFF;
font: bold 16px "Trebuchet MS", halvetica, Verdana, sans-serif;
}
.bigger {
font: 18px "Trebuchet MS", halvetica, Verdana, sans-serif;
color: #C0EC15;
}


#wrap #header #logo {
width: 260px;
padding-top: 50px;
padding-left: 50px;
height: 150px;
float: left;
}
#wrap #header #headercontent {
width: 300px;
float: right;
padding-right: 55px;
padding-top: 60px;
height: 125px;
}


#main {background:url(http://www.loaditup.de/files/405489.png) repeat-y; height:900px; padding:2px

9px 0 9px; margin:0;}
#menus {background:url(http://www.loaditup.de/files/405520.jpg) no-repeat;

width:936px; margin:0 auto 10px auto; height:88px;}#submenu ul {
list-style: none;
}
#submenu li {
display: inline;
}
#submenu a {
background: url() no-repeat left;
display: block;
float: left;
height: 16px;
padding-top: 2px;
padding-right: 15px;
padding-left: 15px;
color: #666666;
text-decoration: none;
}
#mainmenu {
height: 55px;
font: bold 14px "Trebuchet MS", halvetica, Verdana, sans-serif;
text-decoration: none;
text-transform: uppercase;
padding-top: 10px;
padding-right: 22px;
padding-left: 22px;
}
#mainmenu a {
display: block;
height: 40px;
padding-right: 25px;
padding-left: 25px;
float: left;
text-decoration: none;
padding-top: 15px;
background: url(http://www.loaditup.de/files/405492.png) no-repeat 0px 3px;
color: #5B920A;
}
#mainmenu .first a {
background: none;
}

#mainmenu li {
display: inline;
}
#mainmenu a:active {
background-image:url(http://www.loaditup.de/files/405493.gif);}

#mainmenu a:visited {
background-image:url();}


no-repeat center top; color:#fff;}
#wrap #main #content {
padding: 10px;
}
#mainmenu a:hover {color:#fff; background: url(http://www.loaditup.de/files/405493.gif);}
#homeleft {width:480px; float:left;}
#homeright { margin-left:500px; }
h1, h2, h3, h4 { font-family:"Trebuchet MS", halvetica, Verdana, sans-serif;}
h1 {font-size:22px;}
h2 {font-size:18px;}
h3 {font-size:16px;}
h4 {font-size:14px;}
#main h2 {color:#333; display:block; padding:3px 0 8px 0;}
.green {
color: #5B920A;
}
#homeright h3 {
color: #5B920A;
font-weight: normal;
font-size: 14px;
margin-top: 5px;
margin-bottom: 8px;
}
#main p {
line-height: 16px;
margin-bottom: 18px;
}
#homeright .column1 {
width: 31%;
float: left;
padding-right: 5px;
}
#homeright .column3 {
float: left;
width: 32%;
padding-left: 8px;
}
#homeright .column2 {
float: left;
width: 33%;
}
a:visited, a:active {
color: #5B920A;

}

a:hover {
color: #BDEB16;
text-decoration: none;
}
#wrap #footer {
background: url(http://www.loaditup.de/files/405494.png) no-repeat;
height: 70px;
padding-top: 15px;
text-align: center;
color: #666666;
}
#mainmenu ul {list-style:none;}
#submenu a:visited, #submenu a:active {
background: url(background: url(); no-repeat left;
display: block;
float: left;
height: 16px;
padding-top: 2px;
padding-right: 15px;
padding-left: 15px;
color: #666666;
text-decoration: none;
}
#submenu a:hover {

background: url() no-repeat left;
display: block;
float: left;
height: 16px;
padding-top: 2px;
padding-right: 15px;
padding-left: 15px;
color: #000000;
text-decoration: none;
}
#mainmenu .first a:visited, #mainmenu .first a:active {

background: url(http://www.loaditup.de/files/405493.gif);
}
#productlist {
list-style: none;
}
#productlist li {
display: block;
padding: 3px;
border-bottom: 1px solid #eee;
}
.productimage {
float: left;
}
.post .date {
font-size: 10px;
}
.post h3 {
font-size: 14px;
text-transform: uppercase;
display: block;
margin-bottom: 15px;
}
.post {
padding: 5px;
margin-bottom: 15px;
}
#sidebar1 {
float: left;
width: 49%;
}
#sidebar2 {
float: right;
width: 49%;
}
#homeright ul {
list-style: none;
}
#homeright li {
display: block;
border-bottom: 1px solid #eee;
height: 18px;
}
#homeright li a {
display: block;
height: 15px;
padding-top: 2px;
color: #999999;
text-decoration: none;
background: url(http://www.loaditup.de/files/405497.png) no-repeat 0px 3px;
padding-left: 15px;
}

.form {margin:10px 25px 10px 50px;}
.form .text {
display:block;
border:1px solid #666666;
background: #efefef;
width:250px;
padding:5px;
font-size:14px;
color:#000000;
}
.form label {display:block; margin-bottom:3px; margin-top:10px;}
.form .text:hover{background:#FFFFFF; border: solid 1px #000000;}
.form .text:focus {
background:#efefef;
border: 1px solid #669900;
}
.form .button {
display:block;
border:1px solid #666666;
background:#efefef;
padding:5px 10px 5px 10px;
margin:10px 0px 10px 0px;
}
.form .button:hover {
display:block;
border:1px solid #666666;
background: #ffffff;
padding:5px 10px 5px 10px;
margin:10px 0px 10px 0px;
}

#content {
position: absolute;
left: 50%;
top:440px;
margin-left:-440px;
width: 600px;
height: 760px;
padding:10px;
color: #000000;
font-size: 14px;
font-family: Arial;
background-color:#transparent;
background-image:url();
border: 0px solid #C1F3C3;
overflow:auto;
}
Beitrag23.09.2009 um 19:27 (UTC)    
Titel:

es tut mir wirklich leid, dass ich dir so auf den keks gehe...
aber es geht immer noch nicht...
Beitrag23.09.2009 um 19:32 (UTC)    
Titel:

homepage-vergleich hat Folgendes geschrieben:
homepage-vergleich hat Folgendes geschrieben:
Ist es so besser ?
Ich habe echt alles versucht.


Zitat:
#extraDiv1 {display: none;}
#extraDiv2 {display: none;}
#extraDiv3 {display: none;}
#extraDiv4 {display: none;}
#extraDiv5 {display: none;}
#extraDiv6 {display: none;}
#pre_header {display: none;}
#post_header {display: none;}
#pre_content {display: none;}
#nav_heading{display: none;}
#nav{display: none;}
div.header{display: none;}
h1#title{display: none;}
h2#title span {display: none;}


* { padding:0; margin:0;
}
.clear {clear:both;}
a {
color: #5B920A;
}

body {background:#fff url(http://www.loaditup.de/files/405485.jpg) repeat-x; font: 11px

Verdana, Arial, Helvetica, sans-serif; color:#333;}
#wrap {width:954px; margin:25px auto;}
#header {background:url(http://www.loaditup.de/files/405514.png) no-repeat;

height:207px; }
#logo #sitename {
font-size: 36px;
color: #000000;
display: block;
text-align: center;
padding-top: 5px;
padding-bottom: 5px;
border-bottom: 1px solid #C6C6C6;
}
#headercontent h2 {
font-size: 18px;
color: #5B920A;
}
#wrap #header #logo .description {
display: block;
text-align: center;
font-size: 16px;
padding-top: 10px;
}
#wrap #header #headercontent p {
color: #666666;
}
#wrap #header #sitecption {
margin-right: 380px;
margin-left: 380px;
padding-top: 85px;
color: #FFFFFF;
font: bold 16px "Trebuchet MS", halvetica, Verdana, sans-serif;
}
.bigger {
font: 18px "Trebuchet MS", halvetica, Verdana, sans-serif;
color: #C0EC15;
}


#wrap #header #logo {
width: 260px;
padding-top: 50px;
padding-left: 50px;
height: 150px;
float: left;
}
#wrap #header #headercontent {
width: 300px;
float: right;
padding-right: 55px;
padding-top: 60px;
height: 125px;
}


#main {background:url(http://www.loaditup.de/files/405489.png) repeat-y; height:900px; padding:2px

9px 0 9px; margin:0;}
#menus {background:url(http://www.loaditup.de/files/405520.jpg) no-repeat;

width:936px; margin:0 auto 10px auto; height:88px;}#submenu ul {
list-style: none;
}
#submenu li {
display: inline;
}
#submenu a {
background: url() no-repeat left;
display: block;
float: left;
height: 16px;
padding-top: 2px;
padding-right: 15px;
padding-left: 15px;
color: #666666;
text-decoration: none;
}
#mainmenu {
height: 55px;
font: bold 14px "Trebuchet MS", halvetica, Verdana, sans-serif;
text-decoration: none;
text-transform: uppercase;
padding-top: 10px;
padding-right: 22px;
padding-left: 22px;
}
#mainmenu a {
display: block;
height: 40px;
padding-right: 25px;
padding-left: 25px;
float: left;
text-decoration: none;
padding-top: 15px;
background: url(http://www.loaditup.de/files/405492.png) no-repeat 0px 3px;
color: #5B920A;
}
#mainmenu .first a {
background: none;
}

#mainmenu li {
display: inline;
}
#mainmenu a:active {
background-image:url(http://www.loaditup.de/files/405493.gif);}

#mainmenu a:visited {
background-image:url(http://www.loaditup.de/files/405492.png);}


no-repeat center top; color:#fff;}
#wrap #main #content {
padding: 10px;
}
#mainmenu a:hover {color:#fff; background: url(http://www.loaditup.de/files/405493.gif);}
#homeleft {width:480px; float:left;}
#homeright { margin-left:500px; }
h1, h2, h3, h4 { font-family:"Trebuchet MS", halvetica, Verdana, sans-serif;}
h1 {font-size:22px;}
h2 {font-size:18px;}
h3 {font-size:16px;}
h4 {font-size:14px;}
#main h2 {color:#333; display:block; padding:3px 0 8px 0;}
.green {
color: #5B920A;
}
#homeright h3 {
color: #5B920A;
font-weight: normal;
font-size: 14px;
margin-top: 5px;
margin-bottom: 8px;
}
#main p {
line-height: 16px;
margin-bottom: 18px;
}
#homeright .column1 {
width: 31%;
float: left;
padding-right: 5px;
}
#homeright .column3 {
float: left;
width: 32%;
padding-left: 8px;
}
#homeright .column2 {
float: left;
width: 33%;
}
a:visited, a:active {
color: #5B920A;

}

a:hover {
color: #BDEB16;
text-decoration: none;
}
#wrap #footer {
background: url(http://www.loaditup.de/files/405494.png) no-repeat;
height: 70px;
padding-top: 15px;
text-align: center;
color: #666666;
}
#mainmenu ul {list-style:none;}
#submenu a:visited {
background: url(background: url(); no-repeat left;
display: block;
float: left;
height: 16px;
padding-top: 2px;
padding-right: 15px;
padding-left: 15px;
color: #666666;
text-decoration: none;
}
#submenu a:hover {

background: url() no-repeat left;
display: block;
float: left;
height: 16px;
padding-top: 2px;
padding-right: 15px;
padding-left: 15px;
color: #000000;
text-decoration: none;
}

#productlist {
list-style: none;
}
#productlist li {
display: block;
padding: 3px;
border-bottom: 1px solid #eee;
}
.productimage {
float: left;
}
.post .date {
font-size: 10px;
}
.post h3 {
font-size: 14px;
text-transform: uppercase;
display: block;
margin-bottom: 15px;
}
.post {
padding: 5px;
margin-bottom: 15px;
}
#sidebar1 {
float: left;
width: 49%;
}
#sidebar2 {
float: right;
width: 49%;
}
#homeright ul {
list-style: none;
}
#homeright li {
display: block;
border-bottom: 1px solid #eee;
height: 18px;
}
#homeright li a {
display: block;
height: 15px;
padding-top: 2px;
color: #999999;
text-decoration: none;
background: url(http://www.loaditup.de/files/405497.png) no-repeat 0px 3px;
padding-left: 15px;
}

.form {margin:10px 25px 10px 50px;}
.form .text {
display:block;
border:1px solid #666666;
background: #efefef;
width:250px;
padding:5px;
font-size:14px;
color:#000000;
}
.form label {display:block; margin-bottom:3px; margin-top:10px;}
.form .text:hover{background:#FFFFFF; border: solid 1px #000000;}
.form .text:focus {
background:#efefef;
border: 1px solid #669900;
}
.form .button {
display:block;
border:1px solid #666666;
background:#efefef;
padding:5px 10px 5px 10px;
margin:10px 0px 10px 0px;
}
.form .button:hover {
display:block;
border:1px solid #666666;
background: #ffffff;
padding:5px 10px 5px 10px;
margin:10px 0px 10px 0px;
}

#content {
position: absolute;
left: 50%;
top:440px;
margin-left:-440px;
width: 600px;
height: 760px;
padding:10px;
color: #000000;
font-size: 14px;
font-family: Arial;
background-color:#transparent;
background-image:url();
border: 0px solid #C1F3C3;
overflow:auto;
}


Zuletzt bearbeitet von homepage-vergleich am 23.09.2009, 20:36, insgesamt einmal bearbeitet
Beitrag23.09.2009 um 19:36 (UTC)    
Titel:

nein, das klappt auch nicht.

Oh man, bin dir echt dankbar für deine Bemühungen, weiß gar nicht wie ich das wieder gut machen kann.
Vielleicht kommen wir ja irgendwann, irgendwie, irgendwo drauf.
Oder jemand anderes.

Liebe Grüße,
Jens Smile
Beitrag23.09.2009 um 19:42 (UTC)    
Titel:

Entschuldignung,
aber ich habe keine Idee mehr.

Ich habe echt alles probiert.
Mache dir lieber ein BK Design.
Diese Templates funktionieren nie richtig. Wink
Beitrag23.09.2009 um 19:48 (UTC)    
Titel:

Hi,

die Eigenschaft :active ist nicht für den gerade angeklickten Link, sondern für den Moment, wenn man auf einen link klickt, die Maus jedoch gedrückt hält, zuständig. Siehe auch: http://www.css4you.de/active.html .

Nun zur Frage:

Normalerweise löst man soetwas mit Id's für den Body und die Navigation. Leider haben wir hier darauf keinen Zugriff.

Spontan fällt mir da nix anderes ein als:
Zitat:
<style type="text/css">
<!--
#nav_Seitentitel{Styleanweisungen;}
-->
</style>

Das müsstest du in den Quelltext jeder einzelnen Seite eingeben (NICHT bei Text überm Design). Also für die Seite "Home würde es z.B. so aussehen:
Zitat:
<style type="text/css">
<!--
#nav_Home{background-color:#00ff00;}
-->
</style>

Arrow Das ganze muss in den Quellcode von "Home".

So könnte es funzen, bin mir aber nicht sicher. Wink
______________

Beitrag24.09.2009 um 18:59 (UTC)    
Titel:

hey,
also leider funktioniert das auch nicht. Jetzt habe ich echt alles versucht.

Ich habe jetzt so ein schönes Design, alles funktioniert, bis auf dieser kleine Punkt. Aber ich meine das ich schon Homepages gesehen habe, deren aktuell ausgewählter Menüpunkt andersfarbig hinterlegt ist. Mal schauen, vlt. findet sich ja doch jemand.. Neutral
Beitrag24.09.2009 um 19:11 (UTC)    
Titel:

Du kannst das ganze mit der Eigenschaft checked_menu lösen! Mit dieser klappt es einwandfrei.

Und nun noch ein Beispiel klappt leider nur wenn du die Navigation über
den HPBL regelst:
Zitat:

li.nav_element checked_menu
{
Style-Anweisungen
}


PS: Eine andere Möglichkeit gibt es im HPBK nicht!

Mfg Max
______________
Du hast eine Frage? Ich stehe dir selbstverständlich jeder Zeit zur Verfügung!


Zuletzt bearbeitet von southpark-comedyclub am 24.09.2009, 20:15, insgesamt 2-mal bearbeitet
Beitrag24.09.2009 um 19:14 (UTC)    
Titel:

achso, vielen dank ich probiers mal aus


Zuletzt bearbeitet von jens-hp-service am 24.09.2009, 20:15, insgesamt einmal bearbeitet
Beiträge der letzten Zeit anzeigen:   


Powered by phpBB © 2001, 2005 phpBB Group
Deutsche Übersetzung von phpBB.de