Laqout NavListe und Headerdarstellung - gelöst!

[kvika]

Hallo,
-vor ab: Ich bin blutige Anfängerin und verändere an einem für mich gebastelten Grundgerüst (Kumpel) intuitiv Codes und beobachte was passiert- bitte demensprechend verständnisvoll erklären *seufz* danke...

1. Frage:
das ist die ProbkemseiteSeite (startseite): http://www.nspire.eu/
Ich wünsche mir, dass es so aussieht wie hier: http://www.nspire.eu/index.php?ueber-uns nur ohne der linken Menüleiste.
Wo ist der Hund begraben?

Der Code der Vorlage "Startseite" sieht z.Zt. so aus:

Code: Select all

<!-- wrap starts here -->
<div id="wrap">

<!--header -->
 <div id="header">			
			
 <img src="http://nspire.eu/content/images/77298ce4370b8f2be9c250b18ad12ab7.jpg" height="60" alt="EAE Mutterstadt" border="0" class="header" />		
    
<!--header ends-->					
 </div>
 

</div>	<div id="breadcrumb">{BREADCRUMB}</div>	
<!-- navigation starts-->	
 <div  id="nav">
   {NAV_LIST_UL:F,ID,1,current}
<!-- navigation ends-->	
 </div>					

	<!-- content-wrap starts -->
	<div id="content-wrap">
	<div id="main-solo">	
				
			{CONTENT}

	</div>		
		
		
	<!-- content-wrap ends-->	
	</div>
		
			
		<div id="footer-bottom">		
			
			<p>
			&copy; [PHP]echo date(Y)[/PHP] <strong>EAE Mutterstadt</strong> | Dipl. Ing. K. G. Englmann
Rheingönheimer Str. 77, 67112 Mutterstadt <br /> Tel. 0049 929 445 | E-Mail: info@taschenrechner.info
			
   		</p>		
			
		</div>
		

<!-- footer ends-->
</div>

<!-- wrap ends here -->
</div>

2. Meine Grafik (Banner) im Header ist 60pxl hoch, gleiches habe ich auch in der Vorlage (s. Code oben height="60" ) eingestellt. Trotzdem ist der Header deutlich höher. Was mache ich falsch?

3. Kann ich rechts direkt neben meinem eigentlichen Banner noch zwei Grafiken (Mini-Banner) hintendran setzten, die ich auch auf Seiten Verlinken kann? Wie (Code?) und wo mache ich das?


Ich hoffe, mir kann man helfen,...Vielen Dank!
kvika

[pepe]

Du musst deinen Wapper um alle anderen Container legen.... kontrollier noch mal alle schließenden </DIV> Elemente!

Code: Select all

<!--header ends-->					
 </div>
 

</div>	<div id="breadcrumb">Home</div>	

SCHMEISS DAS 2. </div> MAL RAUS !!!

[breitsch]

1. zwei schliessende divs zuviel:
<!-- wrap starts here -->
<div id="wrap">
<!--header -->
<div id="header">
<!--header ends-->
</div>
</div>
<!-- breadcrumb starts -->
<div id="breadcrumb">Home
<!-- breadcrumb starts -->
</div>
<!-- navigation starts -->
<div id="nav">
<!-- navigation ends-->
</div>
<!-- content-wrap starts -->
<div id="content-wrap">
<!-- content-wrap ends -->
</div>
<!-- footer starts -->
<div id="footer-bottom">
</div>
<!-- footer ends-->
</div>
<!-- wrap ends here -->
</div>

2. der #header (div) hat im CSS ne Höhe von 100px, dazu auch img.header noch mal prüfen ob die Aussen-Abstände dort so gewollt sind

3. etwa so:
<style type="text/css">
<!--
#header {
width:800px;
height:100px;
}
.banner1 {
width:600px;
height:100px;
float:left;
}
.banner2 {
width:200px;
height:50px;
float:right;
}
.banner3 {
width:200px;
height:50px;
float:right;
}
-->
</style>

<div id="header">
<div class="banner1">banner1</div>
<div class="banner2">banner2</div>
<div class="banner3">banner3</div>
</div>

[kvika]

Dankeschön für die schnelle Antwort.

1. Klappt, wunderbar!

2. musste img.header verändern- sieht jetzt schon viel besser aus!
Besteht jetzt noch die Möglichkeit, dass ich über den Banner noch einmal einen türkisenen Abschluss-mini-balken bekomme? (Dass also Haupttextfeld und Banner in dem mittel-türkis "eingebettet" sind)

3. @bretisch: Danke für den Code... nur: wo in meinem CSS muss ich den denn einfügen? Oder muss ich sogar etwas ersetzen?
Und: Habe ich richtig verstanden, dass ich dann an den rotmarkierten Stellen den entsprechenden Link einsetzten muss? Sonst muss ich nichts verändern?:
<div class="banner1">banner1</div>
<div class="banner2">banner2</div>
<div class="banner3">banner3</div>
Ist banner 1 mein Banner/header, den man jetzt schon sieht, oder mein erster zusätzlicher, neuer Banner?

Tut mir leid, bei so vielem Unwissen,
aber ich bin überhaupt ganz stolz, dass ich soweit überhaupt gekommen bin. Aller Anfang ist schwer....


Hier mein CSS code:
*edit* entfernt.

[Cipolla]

Zu 2:

Such in deiner frontend.css nach:

Code: Select all

#wrap {
	position: relative;
	background: #31B5D6 url(/images/wrap-bg.jpg) repeat-y;
	width: 900px;	
	margin: 50px auto 0 auto;
	text-align: left;
}

und füge z.b. in einer neuen Zeile nach "margin: 50px...." folgendes ein:

Code: Select all

padding-top:15px;

Und schmeiss die Zeile am besten raus, weil das Hintergrundbild exisitiert nicht:

Code: Select all

background: #31B5D6 url(/images/wrap-bg.jpg) repeat-y;

Und schau Dir doch mal eine Seite wie z.B. http://www.css4you.de an, damit du ein paar grundlagen von css lernst und vor allem verstehst.

[pepe]

Zu 2. versuch mal:

#wrap {
position: relative;
background: #31B5D6 url(/images/wrap-bg.jpg) repeat-y;
width: 900px;
margin: 50px auto 0 auto;
padding-top: 10px; /* zusaetzlich einbinden */
text-align: left;
}

Tante EDIT sagt: "Zu spät, pepe... und das gleich 2 mal "

[Cipolla]

Hehe...

Wenn dann schon 15px, Pepe

Wie rechts und links

[juergen]

Pepe ist eben sparsam

Den shop als Popup zu definieren ist kontraproduktiv... da springt sofort jeder popup Blocker an. Spendiere dem "_blank" als target und dann klappts auch mit der Kasse

[kvika]

ihr seid ja ein lustiges Völkchen
Vielen Dank!
Bin ganz begeistert, hat geklappt.
Diese gewisse Zeile, habe ich allerdings nicht gelöscht, da dann Teile des Hintergrundes verschwunden sind...

3. klappt zwar noch nicht, aber ich hab jetzt eh vor, es anders zu lösen

Dankeschön!

[Cipolla]

...
Diese gewisse Zeile, habe ich allerdings nicht gelöscht, da dann Teile des Hintergrundes verschwunden sind...

Ups, hast recht. Das Background-Image exisitiert zwar immer noch nicht, aber die Farbe wird hier auch deklariert.