• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

Problem mit Hintergrund

W

werny

Guest
Bitte diesen thread löschen!
Hat sich erledigt!
Danke
 
Zuletzt bearbeitet:
Hallo,

ich habe mal aus Langeweile dein "Problem" behoben.

Und dort ist das Ergebnis: Aufteilungen einer Seite mittels Tabellen


Hier der Code:

Code:
<html>

<head>

<title>Aufteilungen einer Seite mittels Tabellen</title>

<style type="text/css">
body {margin: 0px 0px;}
table {font-weight: bold;}
.white {background-color: #FFFFFF;}
.black {background-color: #000000;}
.inhalt {background-color: #FF0000;}
</style>

</head>

<body>

<table border="0" align="left" width="100%" height="100%" cellspacing="0" cellpadding="5">
	<tr>
		<td width="30%" class="white"></td>
		<td width="30%" class="white"></td>
		<td width="20%" class="black"></td>
		<td width="20%" class="black"></td>
	</tr>
	<tr>
		<td width="30%" class="white"></td>


		<td width="50%" colspan="2" height="200" class="inhalt" valign="top">
		<!-- Hier kommt dein Inhalt hinein -->
		</td>


		<td width="20%" class="black"></td>
	</tr>
	<tr>
		<td width="30%" class="white"></td>
		<td width="30%" class="white"></td>
		<td width="20%" class="black"></td>
		<td width="20%" class="black"></td>
	</tr>
</table>

</body>
</html>

Ich habs jetzt gelöst, kannst das "Script" benutzen ^^ (jetzt kann der komplette Inhalt in das rote Feld).


Mfg :cool:
 
Zuletzt bearbeitet:
@com783: Du wirst doch nicht ernsthaft ein Tabellenlayout für das Design vorschlagen?
CSS 4 You - The Finest in Stylesheets: Workshop: Layouten ohne Tabellen

Wenn der Inhalt im roten Bereich in der Höhe flexibel sein soll, wirst Du, werny, um ihn immer in der Mitte halten zu können, wohl JavaScript einsetzen müssen. Wenn die Höhe allerdings fest bleiben kann, dann kannst Du es ungefähr so machen:
PHP:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>
<title>Kästchen</title>
<style type="text/css">
html, body {
    background: #000000;
	margin:0px;
	padding:0px;
	height:100%;
	overflow:auto;
}
#weiss{
	width:60%;
	margin:0;
	float:left;
	background-color:#fff;
	height:100%;
}

#rot{
	position:absolute;
	height:200px;
	width:600px;
	margin:-100px 0px 0px -360px;
	top: 50%;
	left: 60%;
	padding: 10px;
	background-color: #f00;
	border: 1px dotted #000000;
	overflow: auto;
}
</style>
</head>
<body>
<div id="weiss"></div>
<div id="rot">
Hier steht der Text.<br />
Hier steht der Text.<br />
Hier steht der Text.<br />
</div>
</body>
</html>
 
Zuletzt bearbeitet:
@com783: Du wirst doch nicht ernsthaft ein Tabellenlayout für das Design vorschlagen?

Ja, tu ich! Weil, schau dir mal an, was passiert, wenn man bei dir das Fenster verkleinert, und was bei meinem passiert und was das für ein Unterschied ist. Und Tabellen sind sowieso viel statischer als CSS in der Positionierung.
 
Ja, tu ich! Weil, schau dir mal an, was passiert, wenn man bei dir das Fenster verkleinert, und was bei meinem passiert und was das für ein Unterschied ist. Und Tabellen sind sowieso viel statischer als CSS in der Positionierung.

Nun, das liegt ja wohl gar nicht am CSS per se, sondern an mir, weil ich den roten Div mit einer festen Breite versehen habe, was sich ändern lässt:

Code:
#rot{
    position:absolute;
    height:200px;
    width:[COLOR="red"]65%[/COLOR];
    margin:-111px 0px 0px [COLOR="red"]-35%[/COLOR];
    top: 50%;
    left: 60%;
    padding: 10px;
    background-color: #f00;
    border: 1px dotted #000000;
    overflow: auto;
}

Auch auf die Gefahr hin, dass Du in Sachen Tabellenlayout Deine Meinung fest hast, nochmal: Strikte Trennung von Inhalt und Design ist der Weg. Mach doch für Dich mal nen Versuch. BTW Ein Doctype gehört auch zu einem Tabellenlayout.
 
Ja, ich finde nur dumm, das der schwarze Hintergrund bei dir autoamtisch zugewiesen wird.

Und mit Doctype's hatte ich schon so meine Probleme...

Naja, Layout mit CSS fällt mir noch schwer.. :icon6:
 
Ja, ich finde nur dumm, das der schwarze Hintergrund bei dir autoamtisch zugewiesen wird.

Das kannst Du ja ändern. Bastle doch zur Übung - Du willst ja in CSS tiefer einsteigen, nicht wahr - das Ganze mal so, dass der schwarze Teil ne eigene Spalte mit extra ID darstellt. Das ist ja das Schöne an CSS. Deinem Einfallsreichtum sind da keine Grenzen gesetzt. Solange Du beim Validieren grünes Licht bekommst, ist es ok.
 
Zurück
Oben