3
Jimdo Header zu hoch (Design Prague)
Hallo,
ich bin Jimdo Enduser und kenne mich leider nicht aus mit CSS.
Kann mir jemand sagen/schreiben, wie ich den Header (Prague Design) viel niedriger bekomme.
Er ist nun so hoch, dass die dargestellten Bilder immer abgeschnitten sind, der Header nimmt einfach zu viel Raum (Höhe) ein.
Vielen Dank!!
(Website: www.enricoweinert.net)
Das ist das CSS:
<script src="https://use.fontawesome.com/aa15c4b08a.js" type="text/javascript"></script>
<style type="text/css">
/*<![CDATA[*/
.jtpl-title {
display: none;
}
.sm-icons {
position: absolute;
top: 10px;
right: 20px;
z-index: 100000;
}
.jtpl-mobile-navigation__borders,
.jtpl-mobile-navigation__borders::before,
.jtpl-mobile-navigation__borders::after {
border-color: #1e1e1e;
}
.j-module a {
color: inherit;
}
@media (min-width: 768px) {
.jtpl-navigation:before {
border-top: 0;
}}
.jtpl-main__inner {
padding: 40px;
margin: 0 auto;
max-width: 1400px;
border-radius: 4px;
}
}
.jtpl-sidebar, .jtpl-footer {
border-top: 0;
padding: 0;
}
/*]]>*/
</style>
ich bin Jimdo Enduser und kenne mich leider nicht aus mit CSS.
Kann mir jemand sagen/schreiben, wie ich den Header (Prague Design) viel niedriger bekomme.
Er ist nun so hoch, dass die dargestellten Bilder immer abgeschnitten sind, der Header nimmt einfach zu viel Raum (Höhe) ein.
Vielen Dank!!
(Website: www.enricoweinert.net)
Das ist das CSS:
<script src="https://use.fontawesome.com/aa15c4b08a.js" type="text/javascript"></script>
<style type="text/css">
/*<![CDATA[*/
.jtpl-title {
display: none;
}
.sm-icons {
position: absolute;
top: 10px;
right: 20px;
z-index: 100000;
}
.jtpl-mobile-navigation__borders,
.jtpl-mobile-navigation__borders::before,
.jtpl-mobile-navigation__borders::after {
border-color: #1e1e1e;
}
.j-module a {
color: inherit;
}
@media (min-width: 768px) {
.jtpl-navigation:before {
border-top: 0;
}}
.jtpl-main__inner {
padding: 40px;
margin: 0 auto;
max-width: 1400px;
border-radius: 4px;
}
}
.jtpl-sidebar, .jtpl-footer {
border-top: 0;
padding: 0;
}
/*]]>*/
</style>
Auf Facebook teilen
Auf Twitter teilen
Auf Reddit teilen
Auf Linkedin teilenBitte markiere auch die Kommentare, die zur Lösung des Beitrags beigetragen haben
Content-ID: 538134
Url: https://administrator.de/contentid/538134
Ausgedruckt am: 24.11.2024 um 16:11 Uhr
3 Kommentare
Neuester Kommentar
Mach das Padding (40px) kleiner, der frisst den Platz weg.
Das kannst Du sehr gut mit einem HTML Inspektor sehen, z.B. im Firefox in den Web Tools.
Das kannst Du sehr gut mit einem HTML Inspektor sehen, z.B. im Firefox in den Web Tools.
Vielen Dank NordicMike,
das hat schon mal geholfen.
DANKE SEHR!
Gibt es eine Möglichkeit noch mehr "zusammenzustauchen"?
Ziwschen der Menüleiste und den Bildern ist noch so viel freier Platz.
ZB: https://www.enricoweinert.net/rooms/rooms-4/
Ich habe das CSS nun folgend umgeschrieben (Padding auf 0 und die Breite verkleinert, damit die Bilder nicht so riesig sind: max-width: 800px;)
<script src="https://use.fontawesome.com/aa15c4b08a.js" type="text/javascript"></script>
<style type="text/css">
/*<![CDATA[*/
.jtpl-title {
display: none;
}
.sm-icons {
position: absolute;
top: 10px;
right: 20px;
z-index: 100000;
}
.jtpl-mobile-navigation__borders,
.jtpl-mobile-navigation__borders::before,
.jtpl-mobile-navigation__borders::after {
border-color: #1e1e1e;
}
.j-module a {
color: inherit;
}
@media (min-width: 768px) {
.jtpl-navigation:before {
border-top: 0;
}}
.jtpl-main__inner {
padding: 0px;
margin: 0 auto;
max-width: 800px;
border-radius: 4px;
}
}
.jtpl-sidebar, .jtpl-footer {
border-top: 0;
padding: 0;
}
/*]]>*/
</style>
das hat schon mal geholfen.
DANKE SEHR!
Gibt es eine Möglichkeit noch mehr "zusammenzustauchen"?
Ziwschen der Menüleiste und den Bildern ist noch so viel freier Platz.
ZB: https://www.enricoweinert.net/rooms/rooms-4/
Ich habe das CSS nun folgend umgeschrieben (Padding auf 0 und die Breite verkleinert, damit die Bilder nicht so riesig sind: max-width: 800px;)
<script src="https://use.fontawesome.com/aa15c4b08a.js" type="text/javascript"></script>
<style type="text/css">
/*<![CDATA[*/
.jtpl-title {
display: none;
}
.sm-icons {
position: absolute;
top: 10px;
right: 20px;
z-index: 100000;
}
.jtpl-mobile-navigation__borders,
.jtpl-mobile-navigation__borders::before,
.jtpl-mobile-navigation__borders::after {
border-color: #1e1e1e;
}
.j-module a {
color: inherit;
}
@media (min-width: 768px) {
.jtpl-navigation:before {
border-top: 0;
}}
.jtpl-main__inner {
padding: 0px;
margin: 0 auto;
max-width: 800px;
border-radius: 4px;
}
}
.jtpl-sidebar, .jtpl-footer {
border-top: 0;
padding: 0;
}
/*]]>*/
</style>
Bestimmt, aber ich habe keine Lust es für Dich heraus zu suchen, wenn der Lerneffekt dabei ausbleibt :c)
Mit dem HTML Inspector kannst Du erkennen welcher Code dafür zuständig ist, der den Platz verbraucht und Du kannst die Werte gleich ändern und live zusehen wie sich das auswirkt. Abspeichern kann er nicht. Du musst den Code Bereich in Deinen Dateien finden, ändern und abspeichern. Der Inspektor zeigt ja dann an in welcher Datei und in welcher Zeile der verantwortliche Wert stand.
Mit dem HTML Inspector kannst Du erkennen welcher Code dafür zuständig ist, der den Platz verbraucht und Du kannst die Werte gleich ändern und live zusehen wie sich das auswirkt. Abspeichern kann er nicht. Du musst den Code Bereich in Deinen Dateien finden, ändern und abspeichern. Der Inspektor zeigt ja dann an in welcher Datei und in welcher Zeile der verantwortliche Wert stand.
