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

Contents

Basti225

Neues Mitglied
Hey leute,
habe ein Problem.
Habe 2 Contents nebeneinander.
Doch mit der optimierung für verschiedene Bildschrimgrößen, bin ich nicht zufrieden.
Ich hätt es gerne so wie Beispielsweise Nettuts.
Nur ich bekomm es nicht wirklich hin.

Also es sollen 2 Textfelder nebeneinander sein, und die 2 Felder sollen immer in der Mitte sein. Und wenn man das Fenster kleiner zieht bzw. kleinere Bildschirm hat, soll es bis zu einer Minidest Größe gehen und ab dann, so Scroll Balken kommen.
Ich wüsste zwar, wie man das umsetzt, bekomm es aber nicht hin :-o

Kann mir da jmd. weiterhelfen?

Gruß Basti ;)
 
Werbung:
Webseiten optimiert man nicht auf Bildschirmgrößen sondern auf den Viewport, und der kann durchaus sehr variabel sein.

Wenn Du eine Mindestbreite angeben willst, verwende "min-width".
 
die habens so gelöst find ich eigentlich okey

HTML:
.page_wrap {
  width: 754px;
  float: left;
}

#sidebar {
  float: right;
  position: relative;
}
Die breite der Sidebar wird durch die kleinen Werbeflächen gegeben.

Wenn du mehr angaben brauchst. Rechtsklick auf deiner Verlinkten Seite dann auf das oberste Stylesheet klicken, Ctrl+F drücken und im suchfenster die jeweiligen namen der ids und klassen eingeben.

MFG devilseye
 
Zuletzt bearbeitet:
Werbung:
Danke
ich habe es jetzt so gelöst

HTML:
<html>
<head>
<style>
* {
	margin: 0;
	padding: 0;
	}

#main_wrap {
	margin: 0px auto;
	overflow: visible;
	position: relative;
	width: 1290px;
	}

#content {
	background: #222;
	float: left;
	width: 750px;
	padding: 20px;
	font-family: Verdana;
	font-size: 14px;
	color: #a09e9e;
}

#rechtercontent {
	background: #ff0000;
	width: 460px;
	float: right;
	padding: 20px;
	position: relative;
	overflow: visible;
	font-family: Verdana;
	font-size: 14px;
	color: #9f9f9f;
}

</style>
</head>
<body>
<div id="main_wrap">
	<!--Page Wrap -->
	<div id="content">
		<p> Inhalt blaa </p>
	</div>
	<!-- Sidebar -->
	<div id="rechtercontent">
		<p>Blabhsdfjsdfjdfskisdfk</p>
	</div>
</div>

</body>
</html>
 
Noch eine Frage :D
Ehm, jezz habe ich die Boxen nebeneinander.

Aber jetzt müsste ich es noch hinbekommen (da die Boxen 2 verschieden hintergrundfarben haben)
dass sie beide gleich lang sind.
Aber nicht das beide eine feste Länge bekommen sondern, das die Box 2 sich der länge von Box 1 anpasst, also genau so lang wird, egal wie lang Box 1 ist.

Und anderherum.
Geht das?
Wenn ja, wie?!

Gruß Basti
 
da muss man einen kleinen Trick anwenden denn sonst geht das nicht. Da ich aber nicht mehr weiss wo ich dass gelesen habe muss ich zuerst suchen. aber es geht dass weiss ich.
 
Werbung:
Hmmpf, klappt soweit.
Nur wenn ich, den Browser kleiner ziehe, wird das bild auch kleiner (Länge)
Also verschieben sich die Farbfelder

Kann man das Hintergrundbild fixieren?

Gruß Basti
 
Werbung:
Ja, das dachte ich auch.
Nur das klappt nicht :S
Das bild wird trotzdem kleiner?!

HTML:
body {
	background: #e3e3e3 url(../images/mainbackground2.png) repeat-y 50% 0;
	background-attachment: fixed;
	}
 
Ja das bild wird aber zusammengeschoben...
wenn ich das Browserfenster kleiner mache, wird das Bild auch kleiner :S

Weiß keiner, warum das so ist?!
Weil eig. ist war das bei mir noch nie?!

:(
 
Zuletzt bearbeitet:
Werbung:
HTML:
<!DOCTYPE html>

<html>

    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>New</title>
    </head>

    <body

        style="
	background: #e3e3e3 url('http://upload.wikimedia.org/wikipedia/commons/d/d2/WLA_metmuseum_Rembrandt_Self-portrait_1660.jpg') repeat-y 50% 0;
	background-attachment: fixed;">

    </body>

</html>

Da wird nichts kleiner.
 
Ja aber, es verschiebt sich, und wenn du nun, ein Bild hast, was 2 Boxen trennt und es sich verschiebt, dann ist das scheiße.
Weil dann der Hintergrund von der Rechten box i.wo in der Mitte von der linken Box hängt?!

Kann man das nicht i.wie verhindern?!

Oben, wie es sein sollte, wie es auch ist, wenn der Browser 1440x900 groß ist
Unten, wie es ist, wenn ich den Browser etwas kleiner schiebe..
 

Anhänge

  • Screen.jpg
    Screen.jpg
    11,3 KB · Aufrufe: 4
wenn ich dich richtig verstehe kannst du es so machen

linke box:
Code:
background-image:url("pfad/bild.jpg");
background-position: top right;
background-repeat: repeat-y;

rechte box:
Code:
background-image:url("pfad/bild.jpg");
background-position: top left;
background-repeat: repeat-y;

das justiert die hintergründe beider boxen zur mitte.
beim verkleinern verschwindet das linke bild unter dem linken boxen rand und das rechte unter dem rechten.
in der mitte verschiebt sich nichts
 
Werbung:
Zurück
Oben