Schrift genau in die Mitte des Buttons setzen
Steffi
- css
0 wahsaga
Hi,
ich bin grad dabei die Seite von der Astro-Ag meiner Schule vom Design zu ändern.
Hab jetzt einen Hintergrund für die Button erstellt und wollte dann erst mit HTML die Schrift drauf machen.
Tja sie is auch drauf und sogar central, NUR oben "hingeklascht".
Ich würde sie gern in der Mitte haben, aber es ist das erste mal, dass ich mit css und java arbeite und ich find keinen passenden befehl...
<div align="center">
<ul id="csstopmenu">
<li class="mainitems">
<div class="headerlinks" ><a href="himmel.html"><font size="+2">Himmel</font></a></div>
</li>
<li class="mainitems">
<div class="headerlinks"><a href="wir.html"><img src="btn/wir.JPG" width="127" height="32" border="0" alt=""></a></div>
</li>
<li class="mainitems">
<div class="headerlinks"><a href="taetigkeiten.html"><img src="btn/taetigkeiten.JPG" width="127" height="32" border="0" alt=""></a></div>
<ul class="submenus">
<li><a href="taetigkeiten.html">Tätigkeiten</a></li>
<li><a href="themen.html">Themen</a></li>
<li><a href="news.html">News</a></li>
<li><a href="vorhaben.html">Vorhaben</a></li>
</ul>
...
CSS:
#csstopmenu, #csstopmenu ul{
padding: 0;
margin: 0;
list-style: none;
}
#csstopmenu li{
float: left;
position: relative;
}
#csstopmenu a{
text-decoration: none;
}
.mainitems{
}
.headerlinks a{
background:url(btn/alle.JPG);
width: 8em;
height: 2.3em;
margin: auto 1px;
color: #dfdfdf;
}
.headerlinks a:hover{
background-color: burlywood;
margin: auto 1px;
color: royalblue;
}
.submenus{
display: none;
width: 100%;
position: absolute;
botton: 0;
left: 0;
}
.submenus li{
background:url(btn/alle2.JPG);
margin: 1px;
width: 100%;
}
.submenus li a{
display: block;
width: 100%;
text-indent: 10px;
color: #dfdfdf;
font-weight: bold;
}
html>body .submenus li a{ /* non IE browsers */
width: auto;
}
.submenus li a:hover{
color: royalblue;
}
#csstopmenu li>ul {/* non IE browsers */
top: auto;
left: auto;
}
#csstopmenu li:hover ul, li.over ul {
display: block;
}
html>body #clearmenu{ /* non IE browsers */
height: 3px;
}
body{
color: #dfdfdf;
}
und Java:
<script type="text/javascript">
startMenu = function() {
if (document.all&&document.getElementById) {
cssmenu = document.getElementById("csstopmenu");
for (i=0; i<cssmenu.childNodes.length; i++) {
node = cssmenu.childNodes[i];
if (node.nodeName=="LI") {
node.onmouseover=function() {
this.className+=" over";
}
node.onmouseout=function(){
this.className=this.className.replace(" over", "")
}
}
}
}
}
if (window.attachEvent)
window.attachEvent("onload", startMenu)
else
window.onload=startMenu;
</script>
Es werden bestimmt noch ein paar andere Fragen folgen, also hab ich gleich ma fast alles kopiert = /
Wäre schön, wenn mir jemand helfen kann!
Steffi
PS: Wenn ihr sinnlose Zeilen entdeckt, wäre es schön, wenn ihr bescheid sagt!
hi,
Hab jetzt einen Hintergrund für die Button erstellt und wollte dann erst mit HTML die Schrift drauf machen.
Tja sie is auch drauf und sogar central, NUR oben "hingeklascht".
Ich würde sie gern in der Mitte haben, aber es ist das erste mal, dass ich mit css und java arbeite und ich find keinen passenden befehl...
"Befehle" wirst du in HTML und CSS auch nicht finden.
Wenn du einen einzeiligen Text vertikal zentrieren willst, gebe dem Element eine passende line-height.
Es werden bestimmt noch ein paar andere Fragen folgen, also hab ich gleich ma fast alles kopiert = /
Ja, klasse. Und wozu? Wer soll sich sowas anschauen, wenn deine Frage a) so leicht zu beantworten ist, und dass b) auch schon des öfteren wurde.
PS: Wenn ihr sinnlose Zeilen entdeckt, wäre es schön, wenn ihr bescheid sagt!
Für diese Fragestellung waren sie fast alle "sinnlos".
gruß,
wahsaga