• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

elemente überlappen sich

Z

zar1

Neues Mitglied
hi wie stelle ich es ein,dass sich die elemente auf meiner website nciht mehr überlappen?
min-width und so habe alles schon eingestellt aber sobald die min-width erreicht wurde und man weiter verkleinert überlappen sie sich irgendwann.
Ich will,dass die Elmente dann sobal dsie die min-width/height erreicht haben genau an der stelle bleiben und gegebenfalls dann aus dem bild gehen wenn man den webbrowser weiterverkleinert wie zb. youtube oder andere seiten es machen.
 
Dein Grundproblem ist das absolute Positionieren der Elemente, ohne zu wissen, was absolute Positionierung überhaupt bedeutet und welchen Einfluss sie auf die Elemente hat.
Deshalb: absolute Positionierung kippen und anderweitig lösen (Stichwort Floats). HTML validieren und vor allem Grundlagen anschauen und aneignen!
 
aber mit flaor kann ich die position nicht festlegen und das mit absolute position habe ich aus einem tutorial.
Wie heißt den die Option die das macht dass ich die elemente nicht mehr überlappen weiß das jemand ?
 
zar1 schrieb:
hi wie stelle ich es ein,dass sich die elemente auf meiner website nciht mehr überlappen?
min-width und so habe alles schon eingestellt aber sobald die min-width erreicht wurde und man weiter verkleinert überlappen sie sich irgendwann.
Zum Vergrößern anklicken....
Erstell mal ein Div um deine gesamte Seite, also
HTML: 
<body> <div id="umrandung"> Inhalt der Seite</div> </body>
Code: 
#umrandung { width: 1024px; }
So bleibt deine Seite immer gleich groß, auch beim verkleinern. Aber da heutzutage es immer mehr mobile Geräte gibt solltest du dir repsonsives Webdesign anschauen.

zar1 schrieb:
Ich will,dass die Elmente dann sobal dsie die min-width/height erreicht haben genau an der stelle bleiben und gegebenfalls dann aus dem bild gehen wenn man den webbrowser weiterverkleinert
Zum Vergrößern anklicken....

HTML: 
<body> <div id="umrandung"> <div id="irgendwas">Inhalt der Seite</div> </div> </body>

Code: 
#umrandung { width: 1024px; } 

@media (max-width: 765px)
{
    #irgendwas
    {
    display: none;
    }
}
Bei einer Bildschirmbreite von kleiner als 765px wird der Inhalt nicht mehr angezeigt.
 
okay danke @Alex55 ich probiers gleich aus

wenn man sich zum Beispiel diese Seite anschaut:

http://www.arenajunkies.com/

da bleiben die elemente immer gleich aber sie gehen zur seite und sobal das element an den linken seitenrand ist stoppt es da und ghet beim weiteren verkleineren rechts raus wie geht sowas
 
zar1 schrieb:
da bleiben die elemente immer gleich aber sie gehen zur seite und sobal das element an den linken seitenrand ist stoppt es da und ghet beim weiteren verkleineren rechts raus wie geht sowas
Zum Vergrößern anklicken....

Da ist der Seiteninhalt, hier jetzt #umrandung genannt, in der Mitte positioniert:

HTML: 
<body> <div id="umrandung"> Inhalt der Seite</div> </body>
Code: 
#umrandung { width: 1024px; margin: 0 auto;  }
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben