Bis jetzt habe ich nie wirklich CSS verwendet, sondern immer alles mit HTML gemacht, bis ich nun für einen Freund eine Homepage erstellte und dazu ein bestehendes CMS-Layout anpassen musste: Die Hauptnavigation von der linken Spalte oben quer durch eingebaut. Soweit hat auch alles geklappt (da der Conde prima auskommentiert ist), nur die Anzeige ist ziemlich verrutscht:
Es sollte sein:
français | lingála | english | Suche
Es ist jedoch die ausgewählte Sprache auf einer eigenen Zeile, ebenso die Suche, z.B. wenn ich französisch anwähle:
français
lingála | english
Suche
Im «template.html» sieht es so aus:
- Code: Alles auswählen
<div id="menubar">{MAINMENU}
<div id="search">{SEARCH}</div>
</div>
Aus dem «style.css» sind wohl die folgenden Passagen relevant:
- Code: Alles auswählen
/** Menübar **/ <!-- sagt wie breit und wie hoch der beige Streifen für die Hauptmenüs ist -->
#menubar {
background : #E7DAB6;
height : 20px;
padding : 190px 0 0 20px;
margin-left : 10px;
margin-right : 10px;
text-align : left;
display : inline;
position : absolute;
top : 190px;
left : 190px;
width : 890px;
z-index : 1;
}
Hier v.a. die obere Hälfte des Codes:
- Code: Alles auswählen
/********************************* MENU ***************************************/
/* Hauptmenüpunkt */
.blockcontent a.menu {padding : 6px 10px 4px 25px;
color : #8F850D;
margin : 0;
font-weight : bold;
display : block;
}
ul.mainmenu {margin-bottom : 0;
margin-left : -15px;
}
li.mainmenu {display : inline;}
li a.menu { border-bottom : 1px solid #8F850D;}
li a.menu:hover {text-decoration : none;
color : #000;
}
/* Aktiver Hauptmenüpunkt */
li a.menuactive {padding : 6px 10px 4px 25px;
color : #000;
text-align : left;
margin : 0px;
font-weight : bold;
display : block;
}
/* Submenüpunkt */
ul.detailmenu {margin-left : -15px;
margin-bottom : 0px;
border-bottom : 1px solid #b0b384;
}
li a.submenu {padding-left : 25px;
font-size : 0.9em;
font-weight : normal;
display : block;
color : #8F850D;
}
li a.submenuactive {padding-left : 25px;
font-size : 0.9em;
font-weight : normal;
display : block;
color : #000;
}
Da stimmt sicher was nicht mit dem «align center»:
- Code: Alles auswählen
/***************************** Suchformular ***********************************/
/* ------------ */
div.search {text-align : center;}
form.searchform {display : block;}
fieldset#searchfieldset {border : none;
margin-top : 5px;
margin-left : 25px;
padding : 0px;
}
input.searchtextfield {width : 100px;
margin : 0px;
margin : 4px 1px;
}
input.searchtextfield:hover { }
input.searchbutton {margin : 5px 0 -3px 7px;
border : none;
background-color : transparent;
}
Die Homepage ist hier: mavallee.lima-city.de (sorry, darf keine verlinkte URL posten) und für wer nicht französisch kann, es geht um einen Freizeitpark in Schwarzafrika, der in den 1950ern stehengeblieben ist (und 1$ Eintritt pro Auto kostet).
Danke für jeden Hinweis, der mich weiterbringt. C.
