Hallo zusammen,
vorab möchte ich erwähnen das ich HTML Grundkenntnisse habe.
Ich bastle gerade an meiner Wordpress Seite. Ich habe einen Wunsch, ich möchte das mein
Menü wie folgt aussieht:
http://www.script-tutorials.com/demos/272/index.html
(nur die Optik würde ich haben wollen. Die Funktionen sollten von Wordpress bleiben.)
Mein Menü sieht momentan wie folgt aus:
http://www.erkanp.com/screenshot_menu.jpg
Ich versuche schon wie verzweifeln die menüs zu trennen, also so wie bei dem Demo.
In etwa so: I Startseite I Store I Kontakt I
die Linien in der Mitte würden mir reichen.
Ich habe auch schon Tutorials ausprobiert. Aber kein erfolg ![]()
Ich vergesse glaube ich immer irgendwas. Sobald ich am Code rumbastle verschiebt sich alles ![]()
das ist mein STYLSHEET CODE für das Menü (style.css):
/*------------------------------ MENU ------------------------------*/
#secondarymenu-container {
height:119px;
padding-top:6px;
position:relative;
z-index:11;
}
#secondarymenu {
float:right;
margin-right:20px;
margin-top:40px;
}
#secondarymenu a {
text-decoration:none;
padding:15px 9px;
display:block;
color:#979797;
}
#secondarymenu a:hover{
color:#4b8e9a;
-webkit-transition: all 0.3s linear;
-moz-transition: all 0.3s linear;
-o-transition: all 0.3s linear;
-ms-transition: all 0.3s linear;
transition: all 0.3s linear;
}
#header-block {
position:relative;
padding-top:47px;
}
#mainmenu-container {
height:59px;
position:absolute;
top:0;
z-index:10;
background:url(images/menu.png) center top no-repeat;
width:100%;
}
#mainmenu li a {
text-align:center;
display:block;
text-decoration:none;
padding:18px 20px;
font-size:15px;
color:#ffffff;
}
#mainmenu li {
position:relative;
}
#mainmenu li a:hover{
color:#4b8e9a;
-webkit-transition: all 0.3s linear;
-moz-transition: all 0.3s linear;
-o-transition: all 0.3s linear;
-ms-transition: all 0.3s linear;
transition: all 0.3s linear;
}
#header #mainmenu li ul {
top:51px;
}
#header li ul {
top:35px;
}
#header li ul .inner {
background:#ededed;
padding:0;
}
#header ul.children li, #header .sub-menu li {
padding:0 !important;
margin:0 !important;
height:25px;
line-height:25px;
}
#header ul.children li a, .sub-menu li a {
color:#7e4da9 !important;
padding:0 !important;
background:none;
height:25px;
line-height:25px;
}
#header ul.children li a:hover, .sub-menu li a:hover {
background:#f1f1f1;
color:#e28510 !important;
border:none !important;
box-shadow:none !important;
}
Alles anzeigen
Hat jemand vielleicht noch Ideen wie man das macht? ![]()
Danke schonmal voraus!