Aktualisierung: Dieser Beitrag kann gelöscht werden, da ich die Sache fallen gelassen habe - war für mich als Laie zu kompliziert, es hat zu viele Bereiche verschoben und ich hätte wohl auch an (zu) vielen anderen Stellen den Code anpassen müssen.

LG, Sonja

Liebes Forum, lieber az,
Ich habe versucht, eine 2. Sidebar links zu erstellen im Tokyo-Design (die eigentliche Sidebar ist ja unten platziert). Es scheint mehr oder weniger zu funktionieren. Allerdings weiss ich noch nicht, wie es bei verschiedenen Bildschirmbreiten aussehen wird... Ich habe Spalten in der offiziellen Design-Sidebar erstellt und diese Element-ID's dann in diese 2. Sidebar-Position gebracht.

Dazu hätte ich jedoch noch folgende Fragen:
1. Wie kann ich den grauen Hintergrund der Sidebar so konfigurieren, dass er nur jeweils so lang ist wie der Inhalt?
2. Wie kann ich um die Titel und Buttons in der Sidebar einen Rand/Abstand machen? (Das funktioniert nicht mit dem padding im Code)
3. Wie kann ich erreichen, dass die Sidebar in der mobilen Version unter die Seiteninhalte gestellt wird und nicht daneben?

Herzlichen Dank für Antworten!

LG Sonja

Hier die Seite und der Code:

https://www.cheminee-staffieri.ch

<style type="text/css">
/*<![CDATA[*/
  
/**2. Sidebar links**/
.jtpl-sidebar #cc-m-12091734891{
  height: 50%;
  width: 260px;
  position: absolute;
  left: 0;
  top: 0;
  margin-top: 70vh;
  padding-left: 50px;
  padding-right: 50px;
  background-color: #444444;
  display: block;
}
.jtpl-sidebar #cc-m-12126492491 {
  height: 50%;
  width: 260px;
  position: absolute;
  left: 0;
  top: 0;
  margin-top: 860px;
  padding-left: 50px;
  padding-right: 50px;
  background-color: #444444;
  display: block;
}
.jtpl-sidebar #cc-m-12126513891 {
  height: 50%;
  width: 260px;
  position: absolute;
  left: 0;
  top: 0;
  margin-top: 1320px;
  padding-left: 50px;
  padding-right: 50px;
  background-color: #444444;
  display: block;
}
 
/*]]>*/
</style>
 
 

Hallo az

Vielen Dank für deine Hilfe! Ok, gut, dann versuche ich es weiter.

Zu deinem Code-Beispiel:
du schreibst
height: 50% *warum?* - meine Antwort: keine Ahnung, hab ich irgendwie von irgendwo kopiert, ich weiss es nicht mehr!

Eine Bitte:
Könntest du hier im Forum einen kleinen Beitrag schreiben zu Media-Queries? Ich weiss ungefähr, was das ist, aber nicht genau, wie das funktioniert. Z.Bsp. wie ermittelt man da die unterschiedlichen px-Werte für die verschiedenen Medias, wie weiss man, was man da eintragen soll?

LG, Sonja