✔ Kleines Problem hinterm Menü

  • Themenstarter Themenstarter Merbi
  • Beginndatum Beginndatum
Status
Nicht offen für weitere Antworten.
M

Merbi

Hallo allerseits,

ich habe mir eine Homepage gebastelt die in 3 teile unterteilt ist.


-----------------------------------------------------

--------------------------------------------
Header
--------------------------------------------
Hier ist über und unter dem Menü ein Abstand der mir gefällt aber da ist ohne das ich ihn porgrammiert habe. Wüsste egrne wie ich ihn beeinflussen kann also verändern.
-------------------------------------------
Menü
--------------------------------------------
Hier ebenfalls

--------------------------------------------
Inhalt
---------------------------------------------



Quellcode:

index:


Code: 
<body>


<div id="header">	

	<h1>Donrather Getränkemarkt</h1>

</div>

	<div id="menue">
	<ul>
 	 <li><a href="index.php?id=home.php">Startseite</a></li>
 	 <li><a href="#">Wir über uns</a></li>
 	 <li><a href="#">Service</a></li>
 	 <li><a href="index.php?id=sortiment.php">Sortiment</a></li>
 	 <li><a href="index.php?id=angebote.php">Angebote der Woche</a></li>
 	 <li><a href="index.php?id=contact.php">Kontakt</a></li>
 	 <li><a href="index.php?id=partner.php">Partner</a></li>
 	 <li><a href="#">Links</a></li>
 	 <li><a href="index.php?id=impressum.php">Impressum</a></li>
	</ul>
	</div>


<div id="main">



Inhalt per php jeweils included	


</div>

<div id="footer">

	
</div>


</div>

Code stylesheet:

Code: 
body {
	background-color: #1F2680;
	font-size : 8pt;
	font-family : Lucida Sans Unicode, Verdana, Arial !important;
	color : #247DD7;
	margin : 0;
}

a {
	color: #FFFFFF;
	background-color: #0099ff;
}
	
a:hover {
	color: #FFFFFF;
	background-color: #0099ff;
}


/* --- Navigation --- */



#menue {
	background-color: #1F2680;
	width: 100%;	
}

#menue li {
 	 display: inline; 
}

#menue li a {
	 background-color: #1F2680;
	 color: #FFFFFF;
 	 padding: 3px 1em;
 	 margin-left: 3px;
 	 border: 1px solid #1F2680;
 	 border-bottom: 0;
	 border-top: 0;
 	 text-decoration: none; 
}

#menue li a:hover {
	 background-color: #1F2680;
	 color: #FFFFFF;
 	 padding: 3px 1em;
 	 margin-left: 3px;
 	 border: 1px solid #FFFFFF;
 	 border-bottom: 0;
	 border-top: 0;
 	 text-decoration: none; 
}


	
/* --- content stuff --- */


#main {
	background-color: #0099ff;
	color: #FFFFFF;
	margin-right: 35px;
	margin-left: 35px;
	height: 450px;
        min-height: 450px;
        height: auto;
}

#header {
	background-color: #0099ff;
	color: #FFFFFF;
	font-size : 15pt;
	margin-right: 35px;
	margin-left: 35px;
  	margin-top: 20px;
	background-image: url(images/tropfen_hell.jpg);
	margin-bottom: -10px;
}

#news {
	position: relative;
	width: 200px;
	float: right;
	margin-right: 50px;
}

#content {
	width: 450px;
	margin-left: 50px;
	margin-top: 20px;
}

#footer {
	height: 20px;
	background-color: #1F2680;
}

.news_entry {
	border-bottom: 1px solid #1F2680;
	padding-top: 20px;						
}

.insert {
	width: 300px;
}


Ich möchte gerne diesen Zwischenraum zwischen header und Menü und zwischen Menü und Inhalt (content) so beeinflussen könnne das er eine bestimmte bg-Farbe hat und aber nicht 100% breit ist sondern nur so breit wie main und header also mit 35px abstand zum rand.

Da ich dort ein hintergrundbild einfügen möchte welches aber dann um das menü drumherum ist.

Ich hoffe das ihr versteht was mein Problem ist weil es schwer zu erklären ist.

MFG Daniel

Sorry für die dumme Beschreibung habe mal die Hintergrundfarbe geändert und die Homepage hochgeladen.

Wie man sieht ist das dunkelblau was den Bereich zwischen header und main füllen soll an der falschen stelle.

MFG Daniel
 
Hi,

versuch es mal hiermit:

Code: 
#menue {
        /*background-color: #1F2680;*/
        background:red;
        margin: 0 35px;
        padding: 20px 0;
}

#menue ul {
        margin:0;
        padding: 0;
}

#main {
        background-color: #0099ff;
        color: #FFFFFF;
        margin-right: 35px;
        margin-left: 35px;
        min-height: 450px;
        height: auto !important;
        height: 450px;
}

#header {
        background-color: #0099ff;
        color: #FFFFFF;
        font-size : 15pt;
        margin-right: 35px;
        margin-left: 35px;
          margin-top: 20px;
        background-image: url(images/tropfen_hell.jpg);
        /*margin-bottom: -10px;*/ /* auskommentiert = deaktiviert */
}

#header h1 {
        margin: 0;
        padding: 0;
}
 
Das sieht schon besser aus.

Das Problem was weiterhin besteht:

Unter dem Menü ist noch ein Bereich der nicht beeinflusbar ist und das Menü geht rechts komplett bis die siete zue nde ist also nicht mit rechtem abstand.

MFg Daniel


Ergänzung: Im IE gehts bis auf den rechten Außenabstand
 
Zuletzt bearbeitet von einem Moderator:
Entferne mal die width:100%-Deklaration aus dem Selektor #menue, dann klappt's auch mit dem rechten Außenabstand.
 
loool danke jetzt zeigt nur noch der Fox da einen weißen balken an zwischen Menü und Main dann wäre es perfekt und ich könnte anfangen grafisch was zu tun


Trotzdem schonmal 100Dank

MFG Daniel
 
Möglicherweise liegt's hieran:

Code: 
#content {
        width: 450px;
        margin-left: 50px;
        margin-top: 20px;
}
 
*aua*

Klar das hatte ich im stylesheet_ie und ausversehen übernommen weil der IE das nimmt um 20 px von der Überschrift runter zu gehn.

Naja die probleme die der ie macht sind ja allen bekannt.

Nochmal Danke


MFG Daniel
 
Zuletzt bearbeitet von einem Moderator:
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück