height/ width = 100% sind nicht wirklich 100%

[String]

Hey, ich wollte meine Seite in drei Spalten teilen, die sich immer ans Display anpassen. Dazu hab ich div-Container erstellt mit jeweils heigth = 100%; und width hat zusammengerechnet ebenfalls den Wert 100%, so dass das gesamte Display gedeckt werden sollte. Leider kam dabei nicht das raus, was ich mir vorgestellt habe.
Ich müsste eine Menge anpassen... margin-left: -8px; margin-top: -9px; ... damit die Abstände weg sind. Zusätzlich muss ich dann heigth auf etwa 102-103% erweitern und das kann's doch nicht sein :/ Da muss es doch einen besseren Weg geben. Ich nutze im übrigen Safari 8.0 auf Mac OS 10.10.

[tr0y]

ab 4 Antworten auf sich selbst zählen wir das offiziell als Selbstgespräch... :P

[String]

Wie könnte ich die 3. Spalte wieder in 3 divs aufteilen, diesmal aber horizontal. Ich möchte nämlich in der 3. Spalte eine obere Leiste und eine untere haben.
Danke vielmals!

Edit: Habe wieder selbst geschafft

[String]

ich habs hinbekommen

[String]

Ein scrollbares div klingt schon mal gut. Ich hab es schon mit overflow-y: auto und scroll und so versucht, aber das klappt nicht. Wie mach ich das?

[tr0y]

Für sowas gibts mehrere Ansätze, entweder ein scrollbares div oder 2 Divs die den body tag "einengen". Kommt auch ein wenig darauf an was du Design-technisch vor hast.

[String]

Super Uuuund.. wie könnte ich machen, dass man nur in der dritten Spalte scrollen kann und die ersten beiden fix bleiben?

[tr0y]

http://jsfiddle.net/tr0y/7swLutLk/

[tkausl]

Das scheint nicht (mehr?) zu funktionieren.

Das funktioniert (noch) nicht in allen Browsern. Trotzdem ist es immer gut zu wissen, wie das Standard-boxsizing aussieht.

box-sizing wird von meinem Notepad-Programm auch nicht als CSS-Tag gekennzeichnet.

Oh.

[String]

Siehe auch: http://www.w3schools.com/cssref/css3_pr_box-sizing.asp

Das scheint nicht (mehr?) zu funktionieren. box-sizing wird von meinem Notepad-Programm auch nicht als CSS-Tag gekennzeichnet.

[tkausl]

Siehe auch: http://www.w3schools.com/cssref/css3_pr_box-sizing.asp

[String]

<div id="sidebar">
	Test
</div>
<div id="overview">
	Test
</div>
<div id="village">
	Test
</div>

bitteschööön
Ich hab bisschen mit der CSS rumexperimentiert und es sieht jetzt so aus, wie ich es mir vorgestellt hab, ist bloß nicht sehr elegant.

#sidebar {
	height: 102.5%;
	width: 25px;
	background-color: red;
	border-right: 1px solid black;
	float: left;
	margin-left: -8px;
	margin-top: -9px;
}

#overview {
	height: 102.5%;
	width: 230px;
	border-right: 1px solid black;
	float: left;
	background-color: yellow;
	margin-top: -9px;
}

#village {
	height: 102.5%;
	width: calc(100% - 241px);
	float: right;
	background-color: green;
	margin-top: -9px;
	margin-right: -8px;
}

[tr0y]

HTML ( CSS ) kennt keine Display-Größen. Das eine HTML Seite standard-Werte zugeteilt bekommt ( margin, padding, border, display, ... ) ist normal und soll auch so.

Poste bitte Konkreten HTML Code der das "tun soll" was du glaubst zu wollen.