Nav-Bearbeitung

[benbas39]

Was hält dich davon ab den i-Tag innerhalb des Anchor-Tags mit CSS anzusprechen?

Ich habe einfach i {} macht das einen Unterschied ob ich i {} oder a i {} mache `?

 

[nookie]

Mit dem ersten sprichst du natürlich alle i-Tags in deinem Quellcode an, selbst die die nicht innerhalb eines Anchor-Tags liegen. Also macht es einen Unterschied.

 

[hannover96xd]

@hannover96xd ´hab nur noch die Frage, die ich an @threadi gestellt habe ! ;-)

Warum bist du nicht im alten Thread geblieben? ich füge einfach mal meine Antwort hier ein:

Theoretisch sollte es funktionieren, wenn du ein HTML-TAG namens span als Kind-Element des a TAGs hinzufügst und dann die "Icon-Klasse" dort einträgst.

<a href="..."><span class="fa fa-home fa-2x">..</span></a>

Mit CSS kannst du dann den Abstand bestimmen.
Du musst dafür die Bootstrap CSS Datei "erweitern", die das icon dort einfügt

.fa:before {
padding-right: 20px;
}

Ich habe das noch nicht ausprobiert, da ich viel zu tun habe. Musst mal gucken, ob es funktioniert.

EDIT:

Eigentlich macht es meiner Meinung keinen Sinn pt zu nehmen, pt wird z. B. für Druck benutzt.
http://www.mediaevent.de/tutorial/masseinheiten.html

Relative Angaben sind besser, z. B. em .

Nun kannst du die Schriftgröße in dem a TAG bestimmen, ohne das das Icon vergrößert / verkleinert wird.

Demo:
http://forenhilfe.bplaced.net/html/2015_01_29_li_soll_link_sein_2/

 

[benbas39]

@hannover96xd , dann geht es aber immer noch nicht, dass wenn ich das Icon z.B 1px weiter unten haben will a i{ margin-top: 1px;} dann geht der Text mit runter. ich will aber, dass NUR das Icon runter geht!

 

[hannover96xd]

@hannover96xd , dann geht es aber immer noch nicht, dass wenn ich das Icon z.B 1px weiter unten haben will a i{ margin-top: 1px;} dann geht der Text mit runter. ich will aber, dass NUR das Icon runter geht!

Denkanstoß:
Ja, ist doch logisch, "i" orientiert sich ja auch an den Übergeordneten Elementen (Eltern-Elementen).

 

[benbas39]

Denkanstoß:
Ja, ist doch logisch, "i" orientiert sich ja auch an den Übergeordneten Elementen (Eltern-Elementen).

Das bedeutet, was muss ich konkret ändern, oder wie würdest du es schreiben in Css ? Das ich es verstehe?

 

[nookie]

Wenn du es verstehen willst, solltest du dir die Grundlagen von HTML und CSS aneignen. Bevor dir hier jeder einzelne Schritt erklärt wird.

 

[benbas39]

Wenn du es verstehen willst, solltest du dir die Grundlagen von HTML und CSS aneignen. Bevor dir hier jeder einzelne Schritt erklärt wird.

Ich verstehe es schon, ich kriege es einfach nicht hin. Ich habe viele Möglichkeiten ausprobiert, wäre nett wenn du mir die Lösung sagen könntest. Bei allen Varianten kommt entweder der Text oder das Icon mit. Ich kann sie nicht einfach beide auf die gleiche Höhe setzen. Ich brauche sie nämlich auf der gleichen Höhe. Sonst siehts blöd aus.

 

[hannover96xd]

Ich würde an deiner stelle so vorgehen:
Lösche den css Teil, der mit dem Problem zu tun hat (in diesem Fall die Navigation) und starte bei Null. Den html Teil löscht du am besten auch.

Nun versuche eine logische Verschachtelung der Navigation zu schreiben. Erst wenn die fertig ist, bearbeitest du die css Datei.

Schreibe kein Formatierungs befehle in deinen Code, wenn du nicht weißt, was das bewirkt.

Gesendet von meinem C1905 mit Tapatalk

EDIT:
http://www.css4you.de/ = Eine gute Adresse für CSS-Erklärungen

 

[nookie]

Ich verstehe es schon, ich kriege es einfach nicht hin. Ich habe viele Möglichkeiten ausprobiert, wäre nett wenn du mir die Lösung sagen könntest. Bei allen Varianten kommt entweder der Text oder das Icon mit. Ich kann sie nicht einfach beide auf die gleiche Höhe setzen. Ich brauche sie nämlich auf der gleichen Höhe. Sonst siehts blöd aus.

Die komplette Lösung musst du dir schon selber erarbeiten. Gehe vor wie mein Vorposter es beschrieben hat und mache wirklich keine Formatierungsangaben, wenn du nicht weißt was diese bewirken bzw. verhalten.