zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden 100% Breite + Layer mit fester Breite + Scrollen

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 06.06.2005, 00:10
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 05.06.2005
Beiträge: 4
Russian befindet sich auf einem aufstrebenden Ast
Standard 100% Breite + Layer mit fester Breite + Scrollen

Hi all!

Hab ein Problem mit 100% Breite.

Hab einen Layer (header), der auf width=100% ist. Dem Layer ist ein 1px breiter background-image, der auf repeat-x gesetzt ist, zugewiesen. Darunter befindet sich der content Layer, der eine feste Breite von 800px hat. Wenn man jetzt das Browser-Fenster schmaler skaliert (z. B. 500px breit), taucht unten ein Scroll-Balken auf. Wenn man jetzt nach rechts scrollt, bleibt der header so breit, wie das Browser-Fenster (500px) und neben dem Layer taucht ein weisser Rand auf. Und genau das ist das Problem. Ich möchte das so hinbekommen, das der Layer beim Scrollen trotzdem in der Breite fensterfüllend ist. Ich hoffe, das war jetzt verständlich genug. Ich habe ein Beispiel online gestellt. Da kann man das Problem genau sehen.

http://repro.cue-webdesign.de/filead...l/template.htm

Hier noch der vollständige Code der Seite:

HTML:

Code:
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Reprocourier</title>
<link href="css/reprocourier.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="header">[img]images/logo.gif[/img]</div>
<div id="content">
	

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p>
	

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p>
</div>
</body>
</html>
CSS:

Code:
body {
	margin: 0px;
	padding: 0px;
}
#header {
	width:auto;
	background-image: url(../images/bg_header.gif);
	background-repeat: repeat-x;
	height: 93px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #AD6565;
}
#logo {
	float: right;
	margin-right: 50px;
}

#content {
	height: 300px;
	width: 800px;
}
Ich hoffe, jemand hatte auch schon mal dieses Problem gehabt und kann mir weiterhelfen.

Habs schon mit suchen im Forum probiert, aber leider nichts vernünftiges gefunden.

Vielen Dank
Russian
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 06.06.2005, 00:32
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.775
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Für standard-konforme Browser:
#header {min-width:800px;}

Den IE entweder ignorieren oder mit Tricks nachhelfen, z.B. dem von Stu Nicholls.

Grüße
fricca
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 06.06.2005, 11:44
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 05.06.2005
Beiträge: 4
Russian befindet sich auf einem aufstrebenden Ast
Standard

hi

danke für die antwort. im firefox funktioniert deine lösung wunderbar.

für den ie habe ich die lösung von stu nichols ausprobiert. leider ohne erfolg. irgendwie funzt es nicht.

hat jemand vielelicht noch ne andere lösung?

vielen dank
russian
Mit Zitat antworten
  #4 (permalink)  
Alt 06.06.2005, 11:50
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 11.01.2005
Ort: Berlin
Beiträge: 2.149
mazzo wird schon bald berühmt werden
Standard

hast Du bei Stu nichols Lösung den korrekten Doctype mit übernommen?
Mit Zitat antworten
  #5 (permalink)  
Alt 06.06.2005, 11:58
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 05.06.2005
Beiträge: 4
Russian befindet sich auf einem aufstrebenden Ast
Standard

ich habe die STANDARDS COMPLIANT mode IE lösung ausprobiert.

bei stu ist xhtml 1.1 und ich habe allerdings 1.0 eingestellt gehabt. meinst du, es könnte daran liegen?
Mit Zitat antworten
  #6 (permalink)  
Alt 06.06.2005, 12:06
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 11.01.2005
Ort: Berlin
Beiträge: 2.149
mazzo wird schon bald berühmt werden
Standard

ja, weil in 1.1 Sonderdefinitionen im Header möglich sind, die Stu einsetzt um kompatible Lösungen zu erreichen. Zumindest in diesem Beispiel, wurde das so gemacht: http://www.stunicholls.myby.co.uk/menus/dropdown.html
Mit Zitat antworten
  #7 (permalink)  
Alt 06.06.2005, 12:11
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 05.06.2005
Beiträge: 4
Russian befindet sich auf einem aufstrebenden Ast
Standard

ich hab grad nachgeschaut...bei min-width for ie ist der header standartkonform (also ohne sonderdefinitionen)

ich werde das aber heute noch mit 1.1 ausprobieren, obwohl ich galube, das diese lösung auch mit 1.0 funktionieren müsste
Mit Zitat antworten
  #8 (permalink)  
Alt 06.06.2005, 12:11
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.775
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Für den min-width-Workaround spielt's aber IMHO keine Rolle, ob XHTML 1.0 oder 1.1
Der Fehler müsste woanders liegen...
Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
div über volle Breite innerhalb eines divs mit fester Breite möglich? philippsen CSS 1 24.11.2013 19:28
Rechte Spalte mit fester Breite; die linke Spalte der Rest zu 100 % web334 CSS 21 16.06.2012 17:27
Variable Breite mit fester Breite vermischen vertex CSS 11 16.10.2006 14:22
flexibles Div soll Div mit fester Breite links umfliessen? braindead CSS 3 23.09.2006 13:58
Zwei Divs nebeneinander Floaten, einer mit fester Breite Phil CSS 0 20.07.2004 20:48


Alle Zeitangaben in WEZ +2. Es ist jetzt 11:27 Uhr.