zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > Knowledge Base
Seite neu laden max-width - und wie gehts im IE

Antwort
 
LinkBack Themen-Optionen Ansicht
  #11 (permalink)  
Alt 10.01.2004, 12:58
Erfahrener Benutzer
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 02.06.2003
Beiträge: 2.441
ulle befindet sich auf einem aufstrebenden Ast
Standard

Ein Test
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//DE" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"  xml:lang="de"> 
<head><title>test</title> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 

<style type="text/css">   <!-- 
   html,body { 
      margin: 0px; 
      padding: 3px 2%; 
      background-color: #FF9933; 
      color: #000000; 
      font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; 
      font-size: 101%; 
   } 

   #frame { 
    min-width: 760px; /* 760px */ 
    max-width: 900px; /* 1000px */ 
	margin: 0px auto;
   } 

   #inner { 
      border: 1px solid #000000; 
      padding: 3px 5px; 
      background-color: #FEFEFE; 
   } 
   p { 
      margin: 1.4em 0;       
      font-size: 0.8em; 
   } 
   --> 
</style> 

</head> 
<body><div id="frame"> 

<div id="inner">
	

Inhalt jeglicher Form.....</p> 
</div>

</div></body></html>
Nun dem IE bringen wir wohl kein max-width bei. Okay

JavaScript kommt für mich nicht in Frage !

Ich habe jetzt nochmal einen Versuch zumindest einen optischen Effekt zu erreichen, bzw. die Verbreiterung im IE auszubremsen.

Könnte mal jemand diese Veranstaltung auf anderen Browsern sich anschauen.

Mozilla / Opera zentrieren schön, bzw, stellen auch den [max-width] ein.

IE6 ist in der [witdh] "gebremst", weil sich der relative padding des BODY auswirkt, und zentriert auch.

Hat jemand noch andere Möglichkeiten zum Testen
__________________
</ulle>
Mit Zitat antworten
Sponsored Links
  #12 (permalink)  
Alt 10.01.2004, 16:24
Benutzer
neuer user
 
Registriert seit: 03.01.2004
Beiträge: 52
gerrit befindet sich auf einem aufstrebenden Ast
Standard

Merkwürdigerweise hat Safari dein Beispiel garnicht gemocht. Irgendwas im CSS-Code hat ihn den gesamten Block verschlucken lassen, keine Formatierungen wurden angezeigt. Nichtmal wenn ich einzelne Eigenschaften kopiert habe, hat er sie verwenden wollen. Ich tippe mal auf Encoding als Ursache. Ist ja auch egal, ich habe einfach dein Beispiel mit dem unteren Code nochmal versimplifizert neu erstellt, und alles funktioniert einwandfrei.

Ein paar Fragen/Anmerkungen: Wozu die vielen verschachtelten div's?
Warum hast du min-width gesetzt, warum sollte auf zB PDAs oder Fenstern die kleiner sind als 760px unbedingt ein horizontaler Scrollbalken kommen? Und vor allem: warum hast dus auf 760px gesetzt, so kommen dank Padding auch bei 800x600 horizontale Scrollbalken.

Warum verwendest du den XHTML1.1-Doctype? Den musst du nämlich vom Webserver her als MIME-Typ Application/xml+xhtml ausliefern. Außer Mozilla versteht das keiner, und der Quellcode wird als XML-Tree dargestellt. Wenn du die Seiten als text/html senden willst, musst du dich auf XHTML1.0 beschränken.


Ausserdem: IMHO macht max-width nur Sinn in Kombination mit einer Angabe in em. Denn sonst skaliert die Textspalte bei Schriftgrößenänderungen nicht mit und es kann zu unlesbaren Ergebnissen führen. Doch Lesbarkeit ist doch gerade das Ziel dieser ganzen max-width-Geschichte, oder?

Ausserdem verstehe ich nicht, warum du durch die expression()-Technik nicht auch Internet-Explorer-Usern die Möglichkeit geben willst, von max-width zu profitieren. Es beeinträchtigt ja vernünftige Browser in keinster Weise, und verlässt sich auch nicht auf JS.

Code:
<html>
<head>
<style type="text/css">

body {
  background: #f93;
  margin: 0;
  padding: 3px 2%;
  font: .76em Verdana, sans-serif;
}

p {
  min-width: 760px;
  max-width: 900px;
  border: thin solid black;
  padding: 3px 5px;
  margin: auto;
}
</style>
</head>
<body>


bla</p>
</body>
</html>
__________________
Gruss, Gerrit

--
http://www.style-sheets.de
Mit Zitat antworten
Sponsored Links
  #13 (permalink)  
Alt 10.01.2004, 19:10
Erfahrener Benutzer
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 02.06.2003
Beiträge: 2.441
ulle befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Warum verwendest du den XHTML1.1-Doctype? Den musst du nämlich vom Webserver her als MIME-Typ Application/xml+xhtml ausliefern. Außer Mozilla versteht das keiner, und der Quellcode wird als XML-Tree dargestellt. Wenn du die Seiten als text/html senden willst, musst du dich auf XHTML1.0 beschränken.
Ach was das wäre mir neu, zumal mein Server die Seiten ausliefert, ohne Probleme und definitionen.

http://www.xhtmlforum.de/viewtopic.php?t=711

Da ist genau diese diskussion.......
__________________
</ulle>
Mit Zitat antworten
  #14 (permalink)  
Alt 10.01.2004, 20:35
Benutzer
neuer user
 
Registriert seit: 03.01.2004
Beiträge: 52
gerrit befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von ulle
Ach was das wäre mir neu, zumal mein Server die Seiten ausliefert, ohne Probleme und definitionen.
Dann freue ich mich dir etwas neues sagen zu dürfen.
text/html ist der MIME-Typ für HTML-Dokumente.
application/xml ist der MIME-Typ für XML-Dokumente.

Wenn du Dokumente nicht mit dem richtigen Inhaltstyp auslieferst (also zB vom Webserver den Content-Type-HTTP-Header richtig setzen lässt), kann das Benutzerprogramm nicht erkennen, ob es sich um XML oder HTML handelt.

XHTML 1.0 ist, wie du sicherlich weißt, eine Reformulierung von HTML 4.01 in XML. Es wurde so gestaltet, dass es vollkommen abwärtskompatibel zu HTML ist. Daher ist eine Auslieferung als text/html gestattet.

XHTML1.1 ist dagegen NICHT vollkommen abwärtskompatibel. Es ist mehr oder weniger eine neue Sprache/Sprachfamilie. Es muss als application/xhtml+xml ausgeliefert werden (nicht "xml+xhtml" wie ich aus Versehen oben fälschlicherweise schrieb). Wenn man kompatibilität erreichen will, muss man XHTML1.0 verwenden.

s. dazu auch:
http://www.hixie.ch/advocacy/xhtml
http://www.w3.org/TR/xhtml-media-types/

Nur weil etwas *funktioniert* (so groß sind die Unterschiede zwischen XHTML1.0(strict) und XHTML1.1 nicht, was den Sprachumfang betrifft), heisst nicht, dass es *richtig* ist. Deine Dokumente können nicht als XML geparst werden, sondern werden als HTML betrachtet. Das mag jetzt noch keine Folgen haben (da Browser afaik XHTML eh nur als HTML betrachten und keine XML-Well-Formedness-Tests durchführen). Dass kann und wird sich aber in Zukunft ändern.
__________________
Gruss, Gerrit

--
http://www.style-sheets.de
Mit Zitat antworten
  #15 (permalink)  
Alt 11.01.2004, 14:00
Webstandards-Evangelist
neuer user
 
Registriert seit: 25.07.2003
Ort: Mainz
Beiträge: 93
Flocke befindet sich auf einem aufstrebenden Ast
Standard Mod: Es wir OT

Hallo Ulle, hallo Gerrit,

ich finde die Diskussion interessant und auch wichtig. Ich denke, wir sollten in irgendeiner Form eine Zusammenfassung der Erkenntnisse in CSS4You an prominenter Stelle integrieren.

ABER: Die Diskussion über XHTML 1.1 (die z.B. Mark Pilgrim sehr vehement geführt hat) gehört nicht in dieses Forum und zu dieser Frage. Deshalb bitte ich Euch [als Mod und Menschenfreund ], diese Diskussion hier zu beenden und eventuell, da würde es Sinn machen, im XHTML-Forum weiterzuführen.

In dieses Froum gehören allerdings Lösungsvorschläge zu Ulles Frage. Mich würde mal interessieren, ob nun mein Vorschlag oder der Linktip von Gerrit die ersehnte Problemlösung gebracht haben.

Danke für die Aufmerksamkeit
__________________
Grüße aus Mainz,

Jens
------------------------------------------------------
[webkrauts.de]
[blog.grochtdreis.de]
Mit Zitat antworten
  #16 (permalink)  
Alt 12.01.2004, 08:43
Erfahrener Benutzer
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 02.06.2003
Beiträge: 2.441
ulle befindet sich auf einem aufstrebenden Ast
Standard

@gerrit

ich würde gerne dieses Thema definitiv zu einer richtigen Lösung bringen.

Hierfür schlage ich unten genannten THREAD als Basis vor, weil er auf einer Diskussion aus dem Sommer aufsetzt.


Hier sollte es weiter gehen
http://www.xhtmlforum.de/viewtopic.php?t=713
__________________
</ulle>
Mit Zitat antworten
  #17 (permalink)  
Alt 12.01.2004, 09:44
Erfahrener Benutzer
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 02.06.2003
Beiträge: 2.441
ulle befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Ein paar Fragen/Anmerkungen: Wozu die vielen verschachtelten div's?
Der innerste Div sollte der Inhalt für die gesamte Website werden, Layout, der mittler Div [frame] umgeht das BOX-Model (zb. border +1px beim [inner]) falls eine Breite für DIV-frame angegeben wird (zB. 96%). Zugegeben wird im Beispiel nicht benötigt.

Ziel ist es nach wie vor einen max-width für den IE zu bekommen !!!

Durch den relativen Padding im Body wollte ich nur erreichen das beim skalieren der WEBsite mit dem IE der [frame]-Div relative weniger breit wird. Natürlich ist der effekt nicht spektakulär.........


Zitat:
IMHO macht max-width nur Sinn in Kombination mit einer Angabe in em
Also ich verstehe [width = relative] und [min/max-width = static] , und wenn ich keine [width]-Angabe im DIV-Element (=Blockelement) vorgeben, dann ist der Container relative breit, zumindest wenn das Eltern-Element, in diesem Fall der BODY keine Breitenangabe besitzt.

_________________________


So hier nochmal das gewünschte Layout

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//DE" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"  xml:lang="de"> 
<head><title>test</title> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 

<style type="text/css">   <!-- 
	html,body { 
		margin: 0; 
		padding: 3px 2%; 
		background-color: #FF9933; 
		color: #000000; 
		font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; 
		font-size: 101%; 
	} 
	
	#frame { 
		min-width: 760px; 
		max-width: 900px; 
		margin: 0px auto; 
		border: 1px solid #000000; 
		padding: 3px 5px; 
		background-color: #FEFEFE; 
	} 
	p { 
		margin: 1.4em 0;        
		font-size: 0.8em; 
	} 
  --> 
</style> 

</head> 
<body>

<div id="frame"> 
   

Inhalt jeglicher Form.....</p> 
   

Inhalt jeglicher Form.....</p> 
   

Inhalt jeglicher Form.....</p> 
</div>

</body></html>
Zitat:
Ausserdem verstehe ich nicht, warum du durch die expression()-Technik nicht auch Internet-Explorer-Usern die Möglichkeit geben willst, von max-width zu profitieren
Was meinst Du damit
__________________
</ulle>
Mit Zitat antworten
  #18 (permalink)  
Alt 12.01.2004, 15:05
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 22.09.2003
Beiträge: 129
Alex befindet sich auf einem aufstrebenden Ast
Standard

das meint er:
http://www.svendtofte.com/code/max_width_in_ie/
insbesondere dieses bsp hier:
http://www.svendtofte.com/code/max_w...dth_in_ie.html
funktioniert aber auch nur bei aktiviertem javascript und ist foglich nicht die von dir gewünschte lösung
Mit Zitat antworten
  #19 (permalink)  
Alt 12.01.2004, 15:54
Erfahrener Benutzer
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 02.06.2003
Beiträge: 2.441
ulle befindet sich auf einem aufstrebenden Ast
Standard

Code:
#frame { 
	width:expression(document.body.clientWidth > 900? "900px": "auto" );
	min-width: 760px; /* 760px */ 
	max-width: 900px; /* 1000px */ 
	margin: 0px auto; 
	border: 1px solid #000000; 
	padding: 3px 5px; 
	background-color: #FEFEFE; 
}
Okay, soweit so gut ich kann keine HACKs leiden (ist ja bekannt)

[edit 29.06.2004]
IE-PRINT BUG
siehe hier http://www.xhtmlforum.de/viewtopic.php?p=5933#5933
[/edit]

Sogar im IE6 zentriert, ich dachte das ging nicht wirklich

nur leider, wie zu erwarten


Code:
Ergebnisse des W3C CSS-Validator mit Objekt: 
:
:
:
Fehler
URI : file://localhost/C:\localspace\PHP-Space\buch_test.css
Zeile: 0 Kontext : #frame 
Ungültige Nummer : widthEinlese-Fehler - document.body.clientWidth > 900? "900px": "auto" )
Wie kann man den dann diese CSS-Angabe vor dem Validator verstecken.
__________________
</ulle>
Mit Zitat antworten
Sponsored Links
  #20 (permalink)  
Alt 12.01.2004, 16:10
Webstandards-Evangelist
neuer user
 
Registriert seit: 25.07.2003
Ort: Mainz
Beiträge: 93
Flocke befindet sich auf einem aufstrebenden Ast
Standard

Vielleicht durch Conditional Comments verstecken ????
__________________
Grüße aus Mainz,

Jens
------------------------------------------------------
[webkrauts.de]
[blog.grochtdreis.de]
Mit Zitat antworten
Sponsored Links
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
Problem mit CSS Menü FuFi CSS 1 05.01.2015 15:46
Verschiebungen bei größerem Bildschirm seelefant CSS 4 28.07.2014 15:43
Media Querys - Layout geht wird über den Displayrand angezeigt DarkNemesis84 CSS 9 05.05.2013 22:00
CSS von Plugin beisst! expand CSS 0 28.09.2012 17:44
Mozilla zeigt DIV zu oft an cracki CSS 6 09.03.2008 15:22


Alle Zeitangaben in WEZ +2. Es ist jetzt 04:49 Uhr.