Kann mir bitte mal jemand erklären wie diese pi___ss (gelb eingezeichnete HÖHE entsteht? Nirgens habe ich ein margin / padding / hight angegeben? Ich habe festgestellt das das NUR entsteht wenn ich " #MainNavi li:nth-child(1n) " ... usw. angebe....... dann entsteht diese blöde untere HÖHE (gelb) Was stimmt da nicht, wenn man dann eine height: 1.9em; angibt dann ist es weg, das kann aber doch nicht die Lösung sein, oder???  ~~~css #MainNavi { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-around; background-color: rgb(255,255,255); background-color: rgba(255,255,255,.22); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=22)"; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=22); z-index: 1; border: 2px solid orange; } #MainNavi li:nth-child(1n) {display: flex; flex: 1.1; justify-content: center; align-items: center; border: 1px dotted yellow;} #MainNavi li:nth-child(2n){display: flex; flex: 1.4; justify-content: center; align-items: center; border: 1px dotted yellow;} #MainNavi li:nth-child(3n), #MainNavi li:nth-child(4n) {display: flex; flex: 1; justify-content: center; align-items: center; border: 1px dotted yellow;} #MainNavi li:nth-child(5n) {display: flex; flex: 2.8; justify-content: center; align-items: center; border: 1px dotted yellow;} #MainNavi li a:link { color: black; font-size: 22px; font-size: 1.375rem; line-height: 100%; text-decoration: none; list-style-type: none; } #MainNavi li a:hover { color: mediumblue; font-size: 22px; font-size: 1.375rem; line-height: 100%; text-decoration: underline; font-weight: bold; list-style-type: none; } ~~~ hier mal ein Link zum Projekt: [Projektseite](http://www.wald-frieden.net/sturm/cv.html) Gruss t.

Kann mir bitte mal jemand erklären wie diese pi___ss (gelb eingezeichnete HÖHE entsteht? Nirgens habe ich ein margin / padding / hight angegeben? Ich habe festgestellt das das NUR entsteht wenn ich " #MainNavi li:nth-child(1n) " ... usw. angebe....... dann entsteht diese blöde untere HÖHE (gelb) Was stimmt da nicht, wenn man eine height: 1.9em; angibt dann ist es weg, das kann aber doch nicht die Lösung sein, oder???  ~~~css #MainNavi { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-around; background-color: rgb(255,255,255); background-color: rgba(255,255,255,.22); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=22)"; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=22); z-index: 1; border: 2px solid orange; } #MainNavi li:nth-child(1n) {display: flex; flex: 1.1; justify-content: center; align-items: center; border: 1px dotted yellow;} #MainNavi li:nth-child(2n){display: flex; flex: 1.4; justify-content: center; align-items: center; border: 1px dotted yellow;} #MainNavi li:nth-child(3n), #MainNavi li:nth-child(4n) {display: flex; flex: 1; justify-content: center; align-items: center; border: 1px dotted yellow;} #MainNavi li:nth-child(5n) {display: flex; flex: 2.8; justify-content: center; align-items: center; border: 1px dotted yellow;} #MainNavi li a:link { color: black; font-size: 22px; font-size: 1.375rem; line-height: 100%; text-decoration: none; list-style-type: none; } #MainNavi li a:hover { color: mediumblue; font-size: 22px; font-size: 1.375rem; line-height: 100%; text-decoration: underline; font-weight: bold; list-style-type: none; } ~~~ hier mal ein Link zum Projekt: [Projektseite](http://www.wald-frieden.net/sturm/cv.html) Gruss t.

Kann mir bitte mal jemand erklären wie diese pi___ss (gelb eingezeichnete HÖHE entsteht? Nirgens habe ich ein margin / padding / hight angegeben? Ich habe festgestellt das das NUR entsteht wenn ich " #MainNavi li:nth-child(1n) " angebe....... dann entsteht diese blöde untere HÖHE (gelb) Was stimmt da nicht, wenn man eine height: 1.9em; angibt dann ist es weg, das kann aber doch nicht die Lösung sein, oder???  ~~~css #MainNavi { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-around; background-color: rgb(255,255,255); background-color: rgba(255,255,255,.22); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=22)"; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=22); z-index: 1; border: 2px solid orange; } #MainNavi li:nth-child(1n) {display: flex; flex: 1.1; justify-content: center; align-items: center; border: 1px dotted yellow;} #MainNavi li:nth-child(2n){display: flex; flex: 1.4; justify-content: center; align-items: center; border: 1px dotted yellow;} #MainNavi li:nth-child(3n), #MainNavi li:nth-child(4n) {display: flex; flex: 1; justify-content: center; align-items: center; border: 1px dotted yellow;} #MainNavi li:nth-child(5n) {display: flex; flex: 2.8; justify-content: center; align-items: center; border: 1px dotted yellow;} #MainNavi li a:link { color: black; font-size: 22px; font-size: 1.375rem; line-height: 100%; text-decoration: none; list-style-type: none; } #MainNavi li a:hover { color: mediumblue; font-size: 22px; font-size: 1.375rem; line-height: 100%; text-decoration: underline; font-weight: bold; list-style-type: none; } ~~~ hier mal ein Link zum Projekt: [Projektseite](http://www.wald-frieden.net/sturm/cv.html) Gruss t.

Kann mir bitte mal jemand erklären wie diese pi___ss (gelb eingezeichnete HÖHE entsteht? Nirgens habe ich ein margin / padding / hight angegeben? Ich habe festgestellt das das NUR entsteht wenn ich " #MainNavi li:nth-child(1n) " angebe....... dann entsteht diese blöde untere HÖHE (gelb) Was stimmt da nicht, wenn man eine height: 1.9em; angibt dann ist es weg, das kann aber doch nicht die Lösung sein, oder???  ~~~css #MainNavi { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-around; background-color: rgb(255,255,255); background-color: rgba(255,255,255,.22); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=22)"; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=22); z-index: 1; border: 2px solid orange; } #MainNavi li:nth-child(1n) {display: flex; flex: 1.1; justify-content: center; align-items: center; border: 1px dotted yellow;} #MainNavi li:nth-child(2n){display: flex; flex: 1.4; justify-content: center; align-items: center; border: 1px dotted yellow;} #MainNavi li:nth-child(3n), li:nth-child(4n) {display: flex; flex: 1; justify-content: center; align-items: center; border: 1px dotted yellow;} #MainNavi li:nth-child(5n) {display: flex; flex: 2.8; justify-content: center; align-items: center; border: 1px dotted yellow;} #MainNavi li a:link { color: black; font-size: 22px; font-size: 1.375rem; line-height: 100%; text-decoration: none; list-style-type: none; } #MainNavi li a:hover { color: mediumblue; font-size: 22px; font-size: 1.375rem; line-height: 100%; text-decoration: underline; font-weight: bold; list-style-type: none; } ~~~ hier mal ein Link zum Projekt: [Projektseite](http://www.wald-frieden.net/sturm/cv.html) Gruss t.

Kann mir bitte mal jemand erklären wie diese pi___ss (gelb eingezeichnete HÖHE entsteht? Nirgens habe ich ein margin / padding / hight angegeben? Ich habe festgestellt das das NUR entsteht wenn ich " #MainNavi li:nth-child(1n) " angebe....... dann entsteht diese blöde untere HÖHE (gelb) Was stimmt da nicht, wenn man eine height: 1.9em; angibt dann ist es weg, das kann aber doch nicht die Lösung sein, oder???  ~~~css #MainNavi { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-around; background-color: rgb(255,255,255); background-color: rgba(255,255,255,.22); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=22)"; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=22); z-index: 1; border: 2px solid orange; } #MainNavi li:nth-child(1n) {display: flex; flex: 1.1; justify-content: center; align-items: center; border: 1px dotted yellow;} #MainNavi li:nth-child(2n){display: flex; flex: 1.4; justify-content: center; align-items: center; border: 1px dotted yellow;} #MainNavi li:nth-child(3n), li:nth-child(4n) {display: flex; flex: 1; justify-content: center; align-items: center; border: 1px dotted yellow;} #MainNavi li:nth-child(5n) {display: flex; flex: 2.8; justify-content: center; align-items: center; border: 1px dotted yellow;} #MainNavi li a:link { color: black; font-size: 22px; font-size: 1.375rem; line-height: 100%; text-decoration: none; list-style-type: none; } #MainNavi li a:hover { color: mediumblue; font-size: 22px; font-size: 1.375rem; line-height: 100%; text-decoration: underline; font-weight: bold; list-style-type: none; } ~~~ hier mal ein Link zum Projekt: [Projektseite](http://www.wald-frieden.net/sturm/cv.html) Gruss t.

Kann mir bitte mal jemand erklären wie diese pi___ss (gelb eingezeichnete HÖHE entsteht? Nirgens habe ich ein hight angegeben? Ich habe festgestellt das das NUR entsteht wenn ich " #MainNavi li:nth-child(1n) " angebe....... dann entsteht diese blöde untere HÖHE (gelb) Was stimmt da nicht, wenn man eine height: 1.9em; angibt dann ist es weg, das kann aber doch nicht die Lösung sein, oder???  ~~~css #MainNavi { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-around; background-color: rgb(255,255,255); background-color: rgba(255,255,255,.22); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=22)"; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=22); z-index: 1; border: 2px solid orange; } #MainNavi li:nth-child(1n) {display: flex; flex: 1.1; justify-content: center; align-items: center; border: 1px dotted yellow;} #MainNavi li:nth-child(2n){display: flex; flex: 1.4; justify-content: center; align-items: center; border: 1px dotted yellow;} #MainNavi li:nth-child(3n), li:nth-child(4n) {display: flex; flex: 1; justify-content: center; align-items: center; border: 1px dotted yellow;} #MainNavi li:nth-child(5n) {display: flex; flex: 2.8; justify-content: center; align-items: center; border: 1px dotted yellow;} #MainNavi li a:link { color: black; font-size: 22px; font-size: 1.375rem; line-height: 100%; text-decoration: none; list-style-type: none; } #MainNavi li a:hover { color: mediumblue; font-size: 22px; font-size: 1.375rem; line-height: 100%; text-decoration: underline; font-weight: bold; list-style-type: none; } ~~~ hier mal ein Link zum Projekt: [Projektseite](http://www.wald-frieden.net/sturm/cv.html) Gruss t.