Menüpunkte hinzufügen

[maduuto]

Hi, ich habe folgenden Code:

<div id="menu">
	<ul>
		<li class="first"><a href="#">Home</a></li>
		<li><a href="anmeldung.php">Anmeldung</a></li>
		<li><a href="wunsch.php">Wie schreibe ich einen Wunsch?</a></li>
		<li><a href="dshinis.php">Wie verdiene ich schnell dshinis?</a>		</li>
		<li><a href="werbung.php">Wie mache ich gut publicity?</a>	</li>
        
	</ul>
</div>

Da möchte ich hinzufügen:

<li><a href="events.php">Spezielle Aktionen</a>	</li>

Seite: http://dshini.1.vg/#
Cssdatei:

/*
Template Design by TheWebhub.com
http://www.thewebhub.com
Released for free under a Creative Commons Attribution-Share Alike 3.0 Philippines
*/


/** Common Styles */
* {
	margin: 0;
	padding: 0;
}

body {
	margin: 0;
	background: #393939;
	line-height: 25px;
	text-align: justify;
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #000000;
}

h1, h2, h3 {
	margin-top: 1.5em;
}

h1 {
	font-size: 2em;
}

h2 {
	font-size: 1.4em;
}

h3 {
	font-size: 1em;
}

p, ul, ol {
	margin-top: 1.5em;
}

ul, ol {
	margin-left: 3em;
}

blockquote {
	margin-left: 3em;
	margin-right: 3em;
}

a {
	color: #1F6196;
}

/** Header Style Starts Here */

#header {
	width: 800px;
	height: 100px;
	margin: 0 auto;
	padding: 0;
}

#header h1 {
	margin: 0;
	padding: 40px 0 10px 55px;
	background: url(images/image08.gif) no-repeat left 90%;
	text-transform: lowercase;
	font-size: 36px;
	font-weight: normal;
	color: #FFFFFF;
}

/** Menu Style Starts Here */


#menu {
	width: 760px;
	height: 43px;
	margin: 0 auto;
	padding: 0 20px;
	background: url(images/image01.jpg) no-repeat left top;
}

#menu ul {
	margin: 0;
	list-style: none;
	padding-top: 20px;
}

#menu li {
	display: inline;
}

#menu a {
	padding: 0 20px;
	background: url(images/image06.gif) no-repeat right 50%;
	text-decoration: none;
	color: #FFFFFF;
}

#menu a:hover {
}

#menu .first a  {
	padding-left: 0;
}

/** Page Style Starts Here */

#page {
	width: 800px;
	margin: 0 auto;
	padding: 0;
	background: url(images/image05.jpg) repeat-y;
}

#page-top {
	background: url(images/image03.jpg) no-repeat left top;
}

#page-bottom {
	
}

#content {
	float: right;
	width: 420px;
	padding: 40px 50px 30px 60px;
}

#content h2 {
	margin: 0;
	padding: 20px 0 10px 0;
	border-bottom: 1px dotted #CFCFCF;
	text-transform: lowercase;
	font-size: 24px;
	font-weight: normal;
}

#sidebar {
	float: left;
	width: 250px;
	padding: 20px 0 0 20px;
}

#sidebar h2 {
	margin: 0;
	padding: 20px 0 10px 0;
	border-bottom: 1px dotted #CFCFCF;
	text-transform: lowercase;
	font-size: 24px;
	font-weight: normal;
}

#sidebar ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

#sidebar li {
	margin: 0;
	padding: 10px 0;
	border-bottom: 1px dotted #CFCFCF;
}
/** Footer Style Starts Here */

#footer {
	width: 800px;
	height: 43px;
	margin: 0 auto;
	padding: 0 0 20px 0;
	background: url(images/image02.jpg) no-repeat left top;
}

#footer p {
	margin: 0;
	padding: 8px 0 0 0;
	text-align: center;
	font-size: 11px;
	color: #FFFFFF;
}

#footer a {
	color: #FFFFFF;
}

Was muss ich in der CSS bearbeiten damit der Menüpunkt sichtbar ist und die Ganze Seite breiter? LG

 

[Maik]

Hi,

soll der hinzuzufügende Verweis als Untermenü einer der existierenden Menüpunkte agieren?

Ansonsten weiß ich nicht, worauf du mit deiner Frage hier im CSS-Forum hinaus willst?

mfg Maik

 

[maduuto]

einfach als weiterer punkt, aber ich habs in php hinzugefügt aber man sieht den menüpunkt nicht, guck mal in 1 min auf die seite!

 

[maduuto]

Also der punkt ist unter Home|Anmeldung in weiß neben der balken, der soll aber in die blaue reihe ganz rechts!

 

[Maik]

Ich seh den Menüpunkt, wenn ich die weiße Schriftfarbe auf schwarz umstelle



Da ist derzeit in deinem Konzept kein Platz vorhanden, damit der Menüpunkt oben rechts erscheint, und vom Browser nicht in die nächste Zeile umgebrochen wird.

mfg Maik

 

[maduuto]

Und wie kann ich Platz schaffen? Wie vergrößere ich die Seite ?

 

[Maik]

Schraub doch einfach mal den 20px-Wert für den horizontalen Innenabstand herunter, und halbiere ihn beispielsweise:

#menu a {
	padding: 0 10px;
	background: url(images/image06.gif) no-repeat right 50%;
	text-decoration: none;
	color: #FFFFFF;
}

mfg Maik

 

[maduuto]

Ok nun wollte ich einen letzten und noch einen hinzufügen, jetzt sieht das doof aus: http://dshini.1.vg/#

Padding ist schon auf 0, was kann ich noch tun damits reinpasst?

 

[Maik]

Ok nun wollte ich einen letzten und noch einen hinzufügen, jetzt sieht das doof aus: http://dshini.1.vg/#

Padding ist schon auf 0, was kann ich noch tun damits reinpasst?

Dafür darfst du dann die Breite des Layouts (800px) aufstocken

Eigentlich logisch, oder?

mfg Maik

 

[Maik]

Dafür darfst du dann die Breite des Layouts (800px) aufstocken

Eigentlich logisch, oder?

... oder die Linktexte verkürzen - insbesondere die Fragestellungen -, oder genau diese vier in einem Untermenü gruppieren, das zunächst versteckt ist, und beim Überfahren des Links erscheint ;-)

"Fragen?" wird dann hierfür als Obermenüpunkt des Submenüs anstelle des Kontaktformulars genutzt.

mfg Maik