• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

Elemente nebeneinander aber trotzdem breite definieren???

TobiasKa

New member
Hallo,
entweder ich hab komplett ein Brett vor dem Kopf oder ich stehe vor einem echten Problem:

ich möchte ein paar Menüpunke horizontal anordnen und habe sie mit <span> formatiert.

Jetzt möchte ich aber die breite definieren, aber das geht ja nur bei block und nicht bei inline elementen (hab ich extra auf selfhtml nachgelesen)

aber sobald den menüpunkt als block element (div) formatiere, beginnt immer eine neue zeile.

Wie kann ich das ohne positionierung auf die Reihe bringen???
 
Moin!
PHP:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Beispiel</title>
<style type="text/css">
<!--
.blah{
float:left;
width:100px;
border:1px solid black;
background-color:lime;
}
-->
</style>
</head>
<body>
<div class="blah">*hick*</div><div class="blah">*hack*</div>
<div style="clear:both">*huck*</div>
</body>
</html>
Ahoi - Pit
 
heute ist wirklcih kein guter tag...

hier das konkrete beispiel (code ist etwas unsauber, aber sonst bekomme ich net hin, dass es in allen browsern gleich aussieht)
HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<html> 
<head> 
<title>Dokumenttitel</title> 
<style type="text/css">
span.button_menue { background-color:#ffff00; font-size: 11px; border: medium double #000066; padding: 3px 6px 3px 6px; margin: 5px 5px 2px 5px; color:#000000; text-align:center; }
.small { font-size: 10px; }
.line { background-color:#ff6600; background-image:url(/system/images/bo_header.jpg); background-repeat:no-repeat; background-position:810px 0px; width:100%; height:90px; padding-top:1px; }
</style> 
</head> 
<body>  
<div class="line" style="color: #000066"><div style="width:800px; height:90px; text-align:center">
<div style="vertical-align:middle; height:55px; font-size:6px;">
<br />
<span style="font-size:14px; font-weight:bold;">conamic 4</span>
<br />
<span class="small">Eingeloggter Benutzer: [var.username] <a href="/modules/system/logout.html">[Logout]</a></span>
</div>
<span class="button_menue"><a href="/modules/system/index.html">Mein conamic</a></span>
<span class="button_menue"><a href="/modules/images/index.html">Bildmanager</a></span>
<span class="button_menue"><a href="/modules/files/index.html">Dateimanager</a></span>
<span class="button_menue"><a href="/modules/content/index.html">Content</a></span>
<span class="button_menue"><a href="/modules/pages/index.html">Seiten</a></span>
<span class="button_menue"><a href="/modules/menue/index.html">Menüs</a></span>
<span class="button_menue"><a href="/modules/users/index.html">Benutzer verwalten</a></span>
</div></div>
</body> 
</html>

Ich will das die Menüpunkte sich in der Breite bestimmen lassen.

wenn ich div und float einsetze, dann haut es die button alle recht oder links hin und zentriert geht net mehr...
 
Zuletzt bearbeitet:
TobiasKa schrieb:
heute ist wirklcih kein guter tag...
In ca. 1.5 Stunden beginnt ein Neuer. Vielleicht ist der besser.

Ich schlage vor, Du machst Dich mal bzgl. der Grundregeln in Sachen HTML und CSS schlau. Vielleicht verbessert das dann auch Deine Tageswahrnehmung.

Edit - Mahlzeit, Herr denz. :grin:
 
Neuer Tag, neues Glück - ich hab jetzt alles alte in den Boden gestampft und es komplett neu gemacht:

HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Dokumenttitel</title>
<style type="text/css">
body {
	font-family: tahoma,verdana,arial;
	margin: 0px;
}
#headerbg { 
	background-color:#ff6600; 
	background-image:url(/system/images/bo_header.jpg); 
	background-repeat:no-repeat; 
	background-position:810px 0px; 
	width:100%; 
	height:70px;
	padding:10px;
}
#header { 
	width: 780px;
	height: 70px;
	text-align:center;
	line-height: 15px; 
}
#content { 
	padding: 15px; 
	font-size: 12px; 
}
.small { 
	font-size: 10px; 
}
.big {
	font-size: 1px; font-weight:bold; 
}

span.button_menu { 
	background-color:#ffff00; 
	font-size: 11px; 
	border: medium double #000066; 
	padding: 3px 10px 3px 10px; 
	margin: 2px 5px 2px 5px; 
	color:#000000; 
	text-align:center; 
}
</style>
</head>

<body>

<div id="headerbg">

<div id="header">

<span class="big">conamic 4</span>
<br />

<span class="small">Eingeloggter Benutzer: [var.username] <a href="/modules/system/logout.html">[Logout]</a></span>

<br /><br />

<span class="button_menu"><a href="/modules/system/index.html">Mein conamic</a></span>

<span class="button_menu"><a href="/modules/images/index.html">Bildmanager</a></span>

<span class="button_menu"><a href="/modules/files/index.html">Dateimanager</a></span>

<span class="button_menu"><a href="/modules/content/index.html">Content</a></span>

<span class="button_menu"><a href="/modules/pages/index.html">Seiten</a></span>

<span class="button_menu"><a href="/modules/menue/index.html">Menüs</a></span>

<span class="button_menu"><a href="/modules/users/index.html">Benutzer verwalten</a></span>

</div>

</div>

</body>

</html>

Jetzt ist es auch in allen Browsern gleich.

Entspricht das jetzt sogar dem schönen Stil oder was gibt es noch zu verbessern?
 
TobiasKa schrieb:
Entspricht das jetzt sogar dem schönen Stil oder was gibt es noch zu verbessern?
Zum einen: was hat das noch mit Deinem Thema zu tun?

Ansonsten solltest Du nicht XHTML in ein HTML-Dokument einbauen. Valide ist der Code auch darüber hinaus nicht.

Ahoi - Pit
 
Zurück
Oben