Div-Abschnitte verschiebt, wenn ich die Größe des Fensters

Ich habe 2 divs Seite an Seite platziert, eine enthält das Logo und zweitens enthält die Textfelder. Wenn ich diese Seite mit größerer Auflösung anschaue, ist alles in Ordnung. Aber wenn ich die Größe des Fensters verändere, wird auch das zweite div geschält und kommt unter das 1. div.Div-Abschnitte verschiebt, wenn ich die Größe des Fensters

Aber ich möchte, dass sie Seite an Seite bleiben, bei jeder Auflösung. Bitte geben Sie die Code-Lösung dafür an.

Quelle

2009-05-21 Anonymous

Sie benötigen einen Code geben, wie Sie dies zu erreichen, da es eine Reihe von Möglichkeiten, die die beste Lösung beeinflussen könnten. – cjk

im Grunde braucht das zweite Div irgendwo zu gehen, wenn es nicht passt. In Ihrem Fall ist die einzige Option, zu beschneiden, also die Zeile in ein div mit Überlauf zu legen: versteckt.

Quelle

2009-05-21 11:41:18 SpliFF

Ich nehme an, Sie verwenden Schwimmer, um sie nebeneinander zu positionieren. Sie können mit einem anderen div von einer minimalen Breite um die beiden divs wickeln Sie die Seite wollen gesehen werden , dass die zweite Absinken unter dem ersten

<div id="wrapper"> 
    <div id="logo">...</div> 
    <div id="text">...</div> 
</div>

Stil für sie wäre zu stoppen.:

#wrapper { width: 980px; } 
#wrapper div { float: left; } 
#logo { width: 200px; } 
#text { width: 780px; }

so etwas. Wenn jemand das Fenster so skaliert, dass es schmaler als 980px ist (oder eine niedrigere Bildschirmauflösung verwendet), erhalten Sie einen horizontalen Bildlauf.

// bearbeiten als Antwort auf den Kommentar können Sie die Mindestbreite verwenden, um es flexibler zu machen. wird IE

#wrapper { min-width: 980px; } 
#wrapper div { float: left; } 
#logo { width: 200px; } 
#text { min-width: 780px; }

Min-Breite wird nicht von IE6 unterstützt, so dass Sie möglicherweise für das Problem beheben müssen.

Quelle

2009-05-21 11:43:19

tatsächlich kann die Einstellung der Breite von #Wrapper, die repariert werden soll, einen Kompromiss der "Fluidität" des Designs verursachen. Wenn die Seite eine feste Breite haben soll, ist es immer besser, dass die Breite oder der oberste Container div gesetzt wird. Die Kindknoten sollten sich nicht viel um die Breite kümmern müssen. – jrharshath

zustimmen. aber kaushik hat keine Anforderungen oder Codebeispiele zur Verfügung gestellt –

das zweite div gleitet unter dem ersten, weil die Breite im Container nicht ausreicht, um beide nebeneinander platzieren zu können.

Dies kann auf zwei Arten behoben werden:

Änderung der „Überlauf“ Eigenschaft des Containerknoten „versteckt“ (oder sogar Überlauf).
Stellen Sie die "Mindestbreite" des Containers ein. Dieser Ansatz wird jedoch durch spezielle Hacks beeinträchtigt, die für IE erforderlich sind. Auch ein minimaler Ansatz kann normalerweise nicht abrupt durchgeführt werden. Es muss vom Anfang des Seitendesigns geplant werden.

Hoffe, dass hilft.

Prost!

Quelle

2009-05-21 11:43:42 jrharshath

Ich versuchte, die Summe der Breiten 1% weniger (1% unbenutzt) von der Summe der beiden divs .... scheint für mich arbeiten :) Myabe ist es nützlich für jemanden.

CSS:

#Content { 
width: 100%; 
height: auto; 
margin-top: 26px; 
float: left; 

} 
#ContentLeft { 
margin-left: 5px; 
float: left; 
width: 19%; 
} 

#ContentMain { 
width: 80%; 
margin-right: 5px; 
float: right; 
}

HTML:

<html> 
<body> 
<div id="Content"> 
<div id="ContentLeft">Left menu</div> 
<div id="ContentMain">Here goes the bigger content</div> 
</div> 
</body> 
</html>

Quelle

2013-08-29 13:11:31 Prasadh

ist nur, dass Ihr 10px (margin-left + margin-right) sind mehr als 1%. Dies sollte funktionieren:

#Content { 
width: 100%; 
height: auto; 
margin-top: 26px; 
float: left; 
} 

#ContentLeft { 
margin-left: 1%; 
float: left; 
width: 19%; 
} 

#ContentMain { 
width: 79%; 
margin-right: 1%; 
float: right; 
}

Quelle

2014-05-12 17:09:32 user3515900

Div-Abschnitte verschiebt, wenn ich die Größe des Fensters

Antwort

Verwandte Themen