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>
Share on Facebook
Share on Twitter
Share on Reddit
Share on LinkedinPlease also mark the comments that contributed to the solution of the article
Content-Key: 538134
Url: https://administrator.de/contentid/538134
Printed on: April 19, 2024 at 20:04 o'clock
3 Comments
Latest comment
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.
