WebWork Magazin - Design, Gestaltung, Online Medien, html

Webhosting Provider Domain

Home | Registrieren | Einloggen | Suchen | Aktuelles | GSL-Webservice | Suleitec Webhosting
Reparatur-Forum | Elektro forum | Ersatzteilshop Haushalt und Elektronik



Im Homepage und Webhosting-Forum --- Horizontale Liste mit Dropdown Zentrieren

HTML, XHTML, CSS , style, XML, Javascript und mehr, Fragen, Tipps und Anregungen zu diesen Basic Techniken - hier rein !

Forum » html xml - Hilfe für das Erstellen einer Homepage » Horizontale Liste mit ... - 12 Dez 2017 Antworten
im Forum für Webhosting Homepage gefunden:
Horizontale Liste mit Dropdown Zentrieren
Ophidian
Pixelschubser
Threadstarter




Beiträge: 3

Hallo miteinander!

Die Überschrift sagt eigentlich bereits alles:

Ich möchte in meiner Webseite unter dem Banner (welches sich in einem Div befindet) eine Horizontale Navigation mit Dropdown (die eine Liste ist und sich ebenfalls in einem Div befindet - Ja, ich arbeite gerne mit Divs ;) ) einbauen. Nun stellt sich bei mir das Problem dar, dass ich diese nicht zentrieren kann :/ Das Dropdown füge ich später übrigens per JavaScript ein.

Ich bin neu im Webseiten erstellen und habe daher nicht gerade viel Erfahrung, also habe ich bis jetzt bloss folgendes:
<ul>
<ul>
<li>1.</li>
<li>1.1</li>
</ul>
<ul>
<li>2.</li>
<li>2.1</li>
</ul>
</ul>

Nun ist es bereits im css so, dass in der ersten Reihe auch schon 1. dann 2. usw. steht, jedoch alles wie rechtsbündig am rechten Bildschirmrand klebt. Kann mir jemand dabei helfen? :D

Wäre sehr dankbar für eine Antwort.

Mfg


Ophidian


---
Was ist eigentlich dieses "RL" von dem hier alle reden? Und wo kann ich es downloaden?

  Profil   Editieren   Zitieren
Ori
Mausakrobat




Beiträge: 163

Der wichtigste Teil (der dann auch die für die Darstellung relevanten CSS-Anteile liefert) ist wohl das Skript. Ganz ohne Skriptcode wird es wohl schwierig, darauf zu antworten.

Aber: Dein Code ist nicht valide. In <ul> darf nur <li> vorkommen, erst im entsprechenden <li> eine neue <ul>:
1: 
2: 
3: 
4: 
5: 
6: 
7: 
8: 
9: 
10: 
11: 
12:
<ul>
<li>1.
<ul>
<li>1.1</li>
</ul>
</li>
<li>2.
<ul>
<li>2.1</li>
</ul>
</li>
</ul>

  Profil   E-Mail   Website   Editieren   Zitieren
Ophidian
Pixelschubser
Threadstarter




Beiträge: 3

Achso, dann danke ich dir :D

Es ging mir eigentlich noch nicht um das Dropdown oder so, sondern bloss dasrum, die Liste in die mitte zu bekommen. Script habe ich noch keines eingefügt, dies wird est noch geschehen, aber danke trotzdem :D

Sobald ich etwas gescripted habe werde ich dies hier natürlich auch reinstellen, doch vorerst werde ich mich bloss mit dem grundgerüst der Seite befassen.

Mfg


Ophidian

---
Was ist eigentlich dieses "RL" von dem hier alle reden? Und wo kann ich es downloaden?

  Profil   Editieren   Zitieren
Ori
Mausakrobat




Beiträge: 163

Ohne es zu testen:
1: 
2: 
3: 
4: 
5:
#navi { display: block; text-align: center; list-style: none; padding: 0; margin: 0; }
#navi a { display: block; }
#navi > li { display: inline-block; position: relative; }
#navi > li > ul { display: none; position: absolute; }
#navi > li:hover > ul { display: block; }

1:
<ul id="navi">…</ul>


Es fehlen natürlich noch Abstände, Ränder und vor allem Angaben für Untermenüs. Ein wenig Friemelkram ist dabei, dafür zu sorgen, dass die Links immer die volle Breite ausnutzen.

  Profil   E-Mail   Website   Editieren   Zitieren
Ophidian
Pixelschubser
Threadstarter




Beiträge: 3

hui, hat prima funktioniert :D

und den restlichen kram geht dann irgendwie schon ;)

danke vielmals!

Mfg

Ophidian

---
Was ist eigentlich dieses "RL" von dem hier alle reden? Und wo kann ich es downloaden?

  Profil   Editieren   Zitieren
 

Antworten


Forum » html xml - Hilfe für das Erstellen einer Homepage » Horizontale Liste mit ...

Aktuelle Beiträge zur Hilfe im Forum für Homepage - Horizontale Liste mit Dropdown Zentrieren im Forum Homepage Hosting AntwortenLetztes Posting
WIe kann ich Datum ausblenden?
in "html xml - Hilfe für das Erstellen einer Homepage"
0 20.10.2017 10:02 von Kevinkk
CSS: ul li navigation - Problem mit dem Einrücken
in "html xml - Hilfe für das Erstellen einer Homepage"
2 05.07.2017 15:12 von elster
Javascript: Im Inputfeld nur bestimmte Zeichen erlauben.
in "html xml - Hilfe für das Erstellen einer Homepage"
4 27.06.2017 18:10 von Diskus
Multiplier Your Bitcoins Pay 0.07 BTC get 10 BTC In 12 Hours
in "html xml - Hilfe für das Erstellen einer Homepage"
0 03.03.2017 11:16 von getbtcfast
HTML CSS Lernprogramme
in "html xml - Hilfe für das Erstellen einer Homepage"
5 25.02.2017 20:27 von Powerwalker
HTML Template aus Photoshop heraus?
in "html xml - Hilfe für das Erstellen einer Homepage"
1 16.06.2015 08:58 von Zeus
Positionieren in einer DIV-Box
in "html xml - Hilfe für das Erstellen einer Homepage"
0 02.06.2015 13:45 von Louie
Bilder in Seite
in "html xml - Hilfe für das Erstellen einer Homepage"
1 18.03.2015 10:57 von Kevinkk
Tool zum Strukturieren für Javascript-Consolen-Ausgabe gesucht
in "html xml - Hilfe für das Erstellen einer Homepage"
1 03.02.2015 17:42 von Webinator
Problem mit Zeichenverkettung in Javascript
in "html xml - Hilfe für das Erstellen einer Homepage"
2 31.03.2014 19:03 von raiserle
Online-Inhalte einholen, verarbeiten und Text in Word-Datei umändern.
in "html xml - Hilfe für das Erstellen einer Homepage"
3 03.10.2013 19:11 von Annaa
Tabelle mit Mannschaftslogos
in "html xml - Hilfe für das Erstellen einer Homepage"
1 03.10.2013 19:09 von Annaa
Frage zu UTF-8 Sonderzeichen für Handy
in "html xml - Hilfe für das Erstellen einer Homepage"
1 20.08.2013 14:56 von Herby



Besucher : 5408359    Heute : 1748     Gestern : 1683     Online : 23     12.12.2017    20:45      0 Besucher in den letzten 60 Sekunden        
Die letzten 30 Referrer :

1 20:16 - google.com/search - content
2 18:52 - google.com/search - content
3 17:13 - google.com/search - content
4 14:15 - https://google.at/search - heimlich handy orten kostenlos
5 13:58 - bing.com/search - webseite erstellen anfänger
6 12:21 - google.com/search - content
7 23:07 - google.com/search - content
8 23:06 - google.com/search - content
9 22:25 - google.com/search - content
10 22:24 - google.com/search - content
11 22:00 - google.com/search - content
12 21:01 - bing.com/search - outlook 2016 hotmail problem
13 17:31 - google.com/search - content
14 17:06 - google.com/search - content
15 16:56 - google.com/search - content
16 16:55 - google.com/search - content
17 16:45 - google.com/search - content
18 16:40 - google.com/search - content
19 15:50 - google.com/search - content
20 15:19 - google.com/search - content
21 13:20 - google.com/search - content
22 12:55 - google.com/search - content
23 12:18 - google.com/search - content
24 11:50 - google.com/search - content
25 11:45 - google.com/search - content
26 10:37 - google.com/search - content
27 10:02 - google.com/search - content
28 9:44 - google.com/search - content
29 9:43 - google.com/search - content
30 9:33 - google.com/search - content

Nach oben