2017-01-16 1 views
1

Ich habe schon so viele Dinge ausprobiert, dass ich verrückt werde.css html unerwünschte div wrapping

Wie kann ich verhindern, dass cgroup umbrochen wird, wenn der Zoom des Browsers vergrößert wird oder wenn die rechte Seite des Browsers nach links gezogen wird, um die Fensterbreite des Browsers zu minimieren?

Wenn das div die Cpanel-Re-Anchor-Anker oben links von oben rechts auf das fpanel unten rechts umbricht.

Nicht, dass es darauf ankommt, das Endprodukt hat ein großes Gitter in der cgroup. Wenn die Seite manchmal geöffnet wird, hängt cpanel, abhängig davon, wie der Browser auf dem Bildschirm dargestellt wird, außerhalb der Sichtweite zum unteren Rand der Seite, da cpanel tatsächlich unter dem unteren Rand des Browserfensters liegt. Also Benutzer Sache das Gitter existiert nicht.

Danke.

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <title></title> 
 
    <meta charset="utf-8" /> 
 
</head> 
 
<body> 
 
    <div style="min-width: 1730px; min-height: 1050px; max-width: 1735px; max-height: 1055px; border-style:solid; border-width:1px; border-color:red; overflow: hidden;"> 
 
     <div id="mpanel" style="min-width: 1730px; max-width: 1730px; min-height: 35px; max-height: 35px; border-style:solid; border-width:1px; border-color:lightgray; background-color:slategray;"> 
 
     </div> 
 
     <div id="fpanel" style="float:left; min-width: 300px; max-width: 300px; min-height: 990px; max-height: 990px; border-style:solid; border-width:1px; border-color:lightgray; background-color:lightblue"> 
 
      fpanel 
 
     </div> 
 
     <div id="cpanel" style="float:right; min-width: 1430px; max-width: 1430px; min-height: 990px; max-height: 990px; border-style:solid; border-width:1px; border-color:lightgray; overflow: auto;"> 
 
      <div data-container="cgroup"> 
 
       cgroup-cpanel 
 
      </div> 
 
     </div> 
 
     <br style="clear: left;" /> 
 
    </div> 
 
</body> 
 
</html>

Antwort

2

Tweak #fpanel s width-296px (oder was auch immer Wert Nutzen Sie):

<div id="fpanel" style="float:left; min-width: 296px; max-width: 296px;"> 

Snippet unten:

<div style="min-width: 1730px; min-height: 1050px; max-width: 1735px; max-height: 1055px; border-style:solid; border-width:1px; border-color:red; overflow: hidden;"> 
 
    <div id="mpanel" style="min-width: 1730px; max-width: 1730px; min-height: 35px; max-height: 35px; border-style:solid; border-width:1px; border-color:lightgray; background-color:slategray;"> 
 
    </div> 
 
    <div id="fpanel" style="float:left; min-width: 296px; max-width: 296px; min-height: 990px; max-height: 990px; border-style:solid; border-width:1px; border-color:lightgray; background-color:lightblue"> 
 
    fpanel 
 
    </div> 
 
    <div id="cpanel" style="float:right; min-width: 1430px; max-width: 1430px; min-height: 990px; max-height: 990px; border-style:solid; border-width:1px; border-color:lightgray; overflow: auto;"> 
 
    <div data-container="cgroup"> 
 
     cgroup-cpanel 
 
    </div> 
 
    </div> 
 
    <br style="clear: left;" /> 
 
</div>

+2

Danke. Ich schwöre, ich habe daran gearbeitet. Aber es sieht aus und funktioniert jetzt großartig. – Steve