Probleme mit der Navigation

Pimbolie1979 · 19.05.2005, 15:13

Hallo

Ich habe eine Navigation mit CSS und DIV-Elementen erstellt, die aber noch nicht so richtig will. Probleme bereitet mir das Einrücken der Unterpunkte. Damit meine ich das z.b. die Überschrift "Über uns" z.b. um 15px eingerückt ist und die Unterpunkte "Kontakt" und "Impressum" z.B. um 30px eingerückt sind.

Wer sich das optisch veranschaulichen möchte kann dies unter gastgeber-deutschland.de tun

Mein Quelltext ist sehr einfach

Code:

#sidebar
{
	width: 160px;
	float: left;
	padding: 0px;
	margin: 0px;
	border: 1px solid #99a6c8;
}

Also ich mache ein DIV-Element, in dem ich die Navigation Implementieren möchte.

Der Inhalt sieht dann so aus:

Code:

&Uuml;ber uns
  Impressum
  Kontakt

Das ganze habe ich dann folgendermaßen formatiert:

Code:

mieter
{
	font-family: arial;
	font-size: 12px;
	font-weight: bold;
	color: #002276;
	display: block;
 !!!!!!!!!      padding: 20px;  !!!!!!! Hier muss der Fehler liegen !!!!!!1
	border-top: 1px solid #99a6c8;
	border-bottom: 1px solid #99a6c8;  
	background-color: #e9f0fa; 	  
}

#mieter a
{
	font-family: arial;
	font-size: 12px;
	font-weight: normal;
	color: #002276;
	display: block;
	padding-left: 20px;	
	padding-top: 3px;
	padding-right: 3px;
	padding-bottom: 3px;
	border-bottom: 1px solid #dddddd;  
	background-color: #ffffff; 	
	text-decoration: none;  
}

#mieter a:link,visited,active
{
	text-decoration: none;
	color: #002276; 
}

#mieter a:hover
{
	text-decoration: none;
	color: #002276; 
	background-color: #c9d9f3; 
}

Wie schaffe ich es jetzt, dass ich die Überschrift einrücken kann, ohne dabei den rest darunter mitzuverschieben?

Ich möchte, dass der Lila Rahmen (rechts und links), der durch das Padding entstanden ist (siehe Formatierung) verschwindet, so dass nur nur der Hintergrund von der Überschrift Lila ist.

Außerdem möchte ich, dass bei der Überschriften "Über uns", "Suchen & Buchen", und "Reiseservice" oben und unten ein Abstand von 5 Pixeln entsteht. (Dieses habe ich ja mit dem Paddig versucht. Jedoch bringt es nicht die Funktion, die ich erhoft habe.

Wie kann ich es ändern?

Gruss Michael

agrajag · 19.05.2005, 15:23

Ich hab leider nicht so ganz verstanden was du letzlich erreichen willst.
Trotzdem mein Vorschlag:

Verwende eine verschachtelte Liste, da wird schon standardmäßig eingerückt - diese Einrückungen änderst du dann so, wie du es haben möchtest.

Code:

<ul>[*]Über uns <ul>[*]Allgemein[*]Impressum[*]...[/list][*]blablub <ul>[*]...[/list][/list]

Jetzt ist Über uns ein Stück eingerückt und Allgemein noch ein Stück weiter - und: du hast sauberes Markup.

Pimbolie1979 · 19.05.2005, 15:41

Kann man beim Listenelement auch angeben um wie viele Pixel alles eingerückt wird? Und kann man dann auch die Symbole bei den Unterpunkten entfernen?

Gruss

Michael

derHund · 19.05.2005, 15:45

ja. ja.

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Thema bewerten
Thema bewerten:

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Navigation fixen	Desert	PHP Tipps 2008	0	12.05.2008 17:00
Probleme bei Speicherung von serialize() Strings	Manni2k	PHP Tipps 2006	13	15.10.2006 15:06
Probs mit Layout für Navigation mit Grafiken/Hintergrund		HTML, Usability und Barrierefreiheit	3	08.02.2006 19:56
Navigation	snatch-ic	PHP Tipps 2007	4	08.01.2006 12:11
Probleme bei der Installation von Turck MMCache	tomx992	PHP-Fortgeschrittene	2	27.09.2005 20:31
Änderung der datenbank gestützten Navigation		PHP Tipps 2005-2	1	26.09.2005 20:34
Probleme mit dem Layout	Pimbolie1979	HTML, Usability und Barrierefreiheit	7	01.06.2005 16:48
Navigation		PHP Tipps 2005	18	11.04.2005 16:16
Zwei Rechner ins Netz - Router - Hub - Probleme...	imported_Ben	Off-Topic Diskussionen	37	13.01.2005 21:36
Navigation	tikal	PHP Tipps 2004-2	3	03.12.2004 15:28
Mit Templates Navigation erstellen? (welches Templatesyste?)	zwelch	PHP Tipps 2004-2	5	18.11.2004 15:14
[Erledigt] Technische Probleme mit Sessions		PHP-Fortgeschrittene	4	18.11.2004 14:45
[Erledigt] PHP Navigation => Function aufrufen und Navigation ausgeb		PHP Tipps 2004	6	14.10.2004 16:46
Probleme mit css in Tabellen b.z.w. Zellen	scheibo	HTML, Usability und Barrierefreiheit	5	20.06.2004 21:17
PHP Bilder in DB / Probleme bei Änderung		PHP-Fortgeschrittene	1	05.06.2004 11:20

19.05.2005, 15:13
Pimbolie1979 Erfahrener Benutzer Registriert seit: 10.02.2004 Beiträge: 132	Probleme mit der Navigation Hallo Ich habe eine Navigation mit CSS und DIV-Elementen erstellt, die aber noch nicht so richtig will. Probleme bereitet mir das Einrücken der Unterpunkte. Damit meine ich das z.b. die Überschrift "Über uns" z.b. um 15px eingerückt ist und die Unterpunkte "Kontakt" und "Impressum" z.B. um 30px eingerückt sind. Wer sich das optisch veranschaulichen möchte kann dies unter gastgeber-deutschland.de tun Mein Quelltext ist sehr einfach Code: #sidebar { width: 160px; float: left; padding: 0px; margin: 0px; border: 1px solid #99a6c8; } Also ich mache ein DIV-Element, in dem ich die Navigation Implementieren möchte. Der Inhalt sieht dann so aus: Code: Über uns Impressum Kontakt Das ganze habe ich dann folgendermaßen formatiert: Code: mieter { font-family: arial; font-size: 12px; font-weight: bold; color: #002276; display: block; !!!!!!!!! padding: 20px; !!!!!!! Hier muss der Fehler liegen !!!!!!1 border-top: 1px solid #99a6c8; border-bottom: 1px solid #99a6c8; background-color: #e9f0fa; } #mieter a { font-family: arial; font-size: 12px; font-weight: normal; color: #002276; display: block; padding-left: 20px; padding-top: 3px; padding-right: 3px; padding-bottom: 3px; border-bottom: 1px solid #dddddd; background-color: #ffffff; text-decoration: none; } #mieter a:link,visited,active { text-decoration: none; color: #002276; } #mieter a:hover { text-decoration: none; color: #002276; background-color: #c9d9f3; } Wie schaffe ich es jetzt, dass ich die Überschrift einrücken kann, ohne dabei den rest darunter mitzuverschieben? Ich möchte, dass der Lila Rahmen (rechts und links), der durch das Padding entstanden ist (siehe Formatierung) verschwindet, so dass nur nur der Hintergrund von der Überschrift Lila ist. Außerdem möchte ich, dass bei der Überschriften "Über uns", "Suchen & Buchen", und "Reiseservice" oben und unten ein Abstand von 5 Pixeln entsteht. (Dieses habe ich ja mit dem Paddig versucht. Jedoch bringt es nicht die Funktion, die ich erhoft habe. Wie kann ich es ändern? Gruss Michael


Mister Ad PHP Code Flüsterer Registriert seit: 21.08.2005 Beiträge: 4682 PHP-Kenntnisse: Fortgeschritten

19.05.2005, 15:23
agrajag Moderator Registriert seit: 02.10.2006 Beiträge: 3.820 PHP-Kenntnisse: Fortgeschritten	Ich hab leider nicht so ganz verstanden was du letzlich erreichen willst. Trotzdem mein Vorschlag: Verwende eine verschachtelte Liste, da wird schon standardmäßig eingerückt - diese Einrückungen änderst du dann so, wie du es haben möchtest. Code: <ul>[]Über uns <ul>[]Allgemein[]Impressum[]...[/list][]blablub <ul>[]...[/list][/list] Jetzt ist Über uns ein Stück eingerückt und Allgemein noch ein Stück weiter - und: du hast sauberes Markup. __________________ Today you...Tomorrow me.

19.05.2005, 15:41
Pimbolie1979 Erfahrener Benutzer Registriert seit: 10.02.2004 Beiträge: 132	Kann man beim Listenelement auch angeben um wie viele Pixel alles eingerückt wird? Und kann man dann auch die Symbole bei den Unterpunkten entfernen? Gruss Michael

19.05.2005, 15:45
derHund Erfahrener Benutzer Registriert seit: 29.10.2004 Beiträge: 1.781	ja. ja. __________________