Uta: Startseite nicht in 2 Spalten geteilt

SELF-Forum

Startseite nicht in 2 Spalten geteilt

Uta Homepage des Autors (Versionen)
– Informationen zu den Bewertungsregeln

problematische Seite

Hallo,

Für eine neue Webseite in html5 hatte ich 2 Spalten festgelegt:

aside { width:          350px; 
        height:         480px;
        float:          right;
        background-color: #ffffff;
        padding-left:   0px;
        padding-right:  0px;
      }
section 
 {  height:       480px;
    width:        650px;
    background-color: #ffffff;
    padding-left:   0px;
    padding-right:  0px;
    margin-left:    0px;
    margin-right: 400px;
 }

Auf der Startseite möchte ich diese Teilung nicht, da ich da mehrere Grafiken absolute positionieren und verlinken möchte.

Wie ist das möglich?

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. Startseite nicht in 2 Spalten geteilt

    Matthias Scharwies
    – Informationen zu den Bewertungsregeln

    Servus!

    Hallo, Für eine neue Webseite in html5 hatte ich 2 Spalten festgelegt:

     aside { width:          350px; 
         height:         480px;
         float:          right;
         background-color: #ffffff;
         padding-left:   0px;
         padding-right:  0px;
       }
 section {  height:       480px;
     width:        650px;
     background-color: #ffffff;
     padding-left:   0px;
     padding-right:  0px;
     margin-left:    0px;
     margin-right: 400px;
  }

    Auf der Startseite möchte ich diese Teilung nicht, da ich da mehrere Grafiken absolute positionieren und verlinken möchte.

    Gib der section auf der Startseite eine id=start", die dann folgende CSS-Festlegung bekommt:

    #start {
  width: 100%;
}

    Herzliche Grüße

    Matthias Scharwies

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

  2. Startseite nicht in 2 Spalten geteilt

    Gunnar Bittersmann Homepage des Autors
    – Informationen zu den Bewertungsregeln

    @@Uta

    aside { width:          350px; 
        float:          right;
      }
section 
 {  width:        650px;
    margin-right: 400px;
 }

    Wenn die Boxen nicht nebeneinander passen, stehen sie untereinander. Dumm nur, dass falsch herum: aside (also der unwichtigere Inhalt) steht zuerst.

    Und was ist, wenn der Viewport (das Browserfenster) schmaler ist als 650 Pixel, was bei vielen Nutzern der Fall sein dürfte?

    Die Breite von Boxen in Pixel anzugeben ist nie eine gute Idee …

    aside { height:         480px;
      }
section 
 {  height:       480px;
 }

    … die Höhe anzugeben noch weniger. Man kann nicht wissen, welche Höhe der Inhalt auf dem System des Nutzers beansprucht.

    Beschäfitge dich mit Responsive Web Design und Flexbox.

    Auf der Startseite möchte ich diese Teilung nicht

    Gib den Seiten eine ID im html-Element (bspw. <html id="page-home" lang="de">[1]). Dann kannst du Elemente auf bestimmten Seiten per Nachfahrenselektor speziell gestalten (bspw. #page-home section { }.

    da ich da mehrere Grafiken absolute positionieren und verlinken möchte.

    Warum möchtest du die Grafiken absolut positionieren? Das schafft mehr Probleme als dass es welche löst. Das gewünschte Layout erreicht du bestimmt besser auf anderem Weg.

    LLAP 🖖

    --
    Ist diese Antwort anstößig? Dann könnte sie nützlich sein.

    1. lang="de" für deutschsprachige Seiten; für englische lang="en" usw. ↩︎

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln