min-width problem

[Oliver]

ich habe hier im forum gestern irgendwo gelesen das man mit min-width in css für ein div element eine minimum breite einstellen kann........ auch das Internet sacht mir das beim googlen nur leider funktioniert das nicht sowohl FF als auch IE als auch Phase5 ignoriert den befehl........ ist da irgend was falsch dran?

ich habs ganz normal so gemacht:

min-width:50px;

was is da flasch?

danke sehr

[kungschu]

Hallo.

min-width:50px;

was is da flasch?

Nichts. Allerdings können die Fehler ja auch anderwo liegen. Sicher hast du auch gelesen, dass der IE<7 width als min-width interpretiert.

Ohne Link zur Problemseite lässt sich schwerlich mehr sagen.

MfG, Kungschu.

[Oliver]

-----------css-----------------

#navigation
  {
  padding-top:30px;
  background-color:#000000;
  float:left;
  text-align:center;
  width:220px;
  height:400px;
  }

#inhalt
  {
  margin-left:220;
  padding-top:30px;
  padding-left:30px;
  height:400px;
  background-color:#ffffff;
  }

---------html-------------

<div id="navi">
<img class="btn" src="bilder/btn/btn_home.gif" />
<img class="btn" src="bilder/btn/btn_gaestebuch.gif" />
<img class="btn" src="bilder/btn/btn_download.gif" />
<img class="btn" src="bilder/btn/btn_kontakt.gif" />
<img class="btn" src="bilder/btn/btn_impressum.gif" />
<img class="btn" src="bilder/btn/btn_danksagung.gif" />
</div>
<div id="inhalte">aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa</div>

so darum geht es..... jetzt stelle ich folgende probleme fest:

so wie es momentan ist, wird das div element so lange kleiner bis im IE die breite des längsten wortes erreicht ist, dann wird das div element nach unten verschoben......
im FF das div element kleiner wird bis die breite 0 erreicht der text bleibt allerdings neben der navi leiste stehen.......

wenn ich jetzt min-width eingebe dann oder width eingebe im inhalt dann stelle ich auch probleme fest:

im FF scheint alles zu funktionieren wie es soll auch wenn der phase5 editor so tut als ob er min-width nicht kennt (min-) ist wie normale schrift und nur "width" ist blau eingefärbt...

im IE wird der befehl wohl einfach ignoriert so wie es hier aussieht... also was kann ich dagegen tun?

[kungschu]

Hallo.

#navigation
  {
  padding-top:30px;
  background-color:#000000;
  float:left;
  text-align:center;
  width:220px;
  height:400px;
  }

#inhalt
  {
  margin-left:220;
  padding-top:30px;
  padding-left:30px;
  height:400px;
  background-color:#ffffff;
  }

<div id="navi">
<img class="btn" src="bilder/btn/btn_home.gif" />
<img class="btn" src="bilder/btn/btn_gaestebuch.gif" />
<img class="btn" src="bilder/btn/btn_download.gif" />
<img class="btn" src="bilder/btn/btn_kontakt.gif" />
<img class="btn" src="bilder/btn/btn_impressum.gif" />
<img class="btn" src="bilder/btn/btn_danksagung.gif" />
</div>
<div id="inhalte">aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa aaa</div>

Aha. Ein CSS-Ausschnitt, der offenbar nichts mit dem HTML Code darunter zu tun hat.?

so darum geht es..... jetzt stelle ich folgende probleme fest:

so wie es momentan ist, wird das div element so lange kleiner bis im IE die breite des längsten wortes erreicht ist, dann wird das div element nach unten verschoben......

Du meinst, wenn der Viewport kleiner wird? Liegt das Problem nun in der Positionierung?

im FF das div element kleiner wird bis die breite 0 erreicht der text bleibt allerdings neben der navi leiste stehen.......

Das klingt sehr abenteuerlich. Sind Quellcode und CSS denn valide? Wenn nein, solltest du vorerst dafür sorgen.

wenn ich jetzt min-width eingebe dann oder width eingebe im inhalt dann stelle ich auch probleme fest:

Was nun? width oder min-width?

im FF scheint alles zu funktionieren wie es soll auch wenn der phase5 editor so tut als ob er min-width nicht kennt (min-) ist wie normale schrift und nur "width" ist blau eingefärbt...

Das weiß ich nicht.

im IE wird der befehl wohl einfach ignoriert so wie es hier aussieht... also was kann ich dagegen tun?

Um welchen IE handelt es sich denn. Dass der IE<7 min-width nicht kennt, habe ich ja bereits erwähnt.

MfG, Kungschu.

[Oliver]

ja ich hab nur den ausschnitt genommen, da der rest absolut keinen einfluss hat und falls du mit viewport die fenstergröße meinst (die meinte ich nämlich also das sichtbare)(viewport hab ich noch nie gehört [anfänger])

also hab ich auch ein problem mit valide :-( ich weiß gerade nicht was das heißen soll aber sonst funktioniert alles wunderbar....

und ich weiß nicht wie ich es besser beschreiben soll ich hab also links  die navi leiste und daneben den inhalt....

im FF wird jetzt solange der text immer umgebrochen bis das längste wort im inhalt allein steht also nicht mehr weiter umgebrochen werden kann...dann wird scheinbar nur noch das div element kleiner.. es verschwindet also hinter dem text bis es nicht mehr zu sehen ist ich weiß jetzt nicht ob es vllt unter die navigation geschoben wird (könnte ich mal testen die idee kommt mir gerade)

im IE wird wieder der text so lange umgebrochen bis das längste word im inhalt allein steht, also nicht mehr weiter umgebrochen werden kann...dann wird jedoch das div element nach unten geschoben mitsamt text...allerdings hat es ja immer noch durch margin 220 den abstand und steht daher noch an der gleichen stelle nur weiter unten...

und with und min width da ich beides probiert habe nur um das verhalten zu vergleichen....

aber was viel interressanter ist, kann man was unternehmen damit auch der IE min-width kennt bzw gibt es etwas das min-width ersetzt? außerdem hab ich den IE 7 und es scheint trotzdem nicht zu gehen....

[Gunnar Bittersmann]

Hello out there!

falls du mit viewport die fenstergröße meinst (die meinte ich nämlich also das sichtbare)(viewport hab ich noch nie gehört [anfänger])

Ja, der Viewport ist die Anzeigefläche des Browsers, durch die du ins WWW kuckst. Das „Innere“ des Browserfensters, sozusagen. Zum Browserfenster gehören ja außerdem noch Titelleiste, Menüleiste, Adressleiste, Statusleiste, Sidebar, ...

also hab ich auch ein problem mit valide :-( ich weiß gerade nicht was das heißen soll

Valid ist ein Dokument, wenn es den Regeln der Sprache entspricht, in der es geschrieben ist. Zur Überprüfung dienen Validatoren:

HTML: http://validator.w3.org/, http://www.validome.org/, http://schneegans.de/sv/

CSS: http://jigsaw.w3.org/css-validator/

Wenn HTML und CSS nicht valid sind, sollte man sich über unerwünschte Darstellung nicht wundern.

See ya up the road,
Gunnar

[Oliver]

Oh Oh die html datei ist nicht valide scheinbar fehlt da eine dokumententypdeklaration....was muss denn da alles rein? ich hab da null ahnung.... mit sowas hab ich mich noch nie befasst (ich google jetzt auch mal aber kann ja sein das ihr da ne schöne vorlage oder seite habt..)

naja ich hoffe dann klappt es besser

[Gunnar Bittersmann]

Hello out there!

ich google jetzt auch mal

Warum in die Ferne schweifen, wenn das http://de.selfhtml.org/@title=Gute so nah ist?

See ya up the road,
Gunnar

[Oliver]

ja das hatte ich auch entdeckt ^^ hier gibt es auch alles ich weiß zwar nicht genau welche version ich benutze aber ich habs einfach mal eingefügt ;-)

jetzt stelle ich einen gravierenden unterschied fest zwischen FF und IE

und zwar wird bei min-width angabe im FF solange verkleinert bis min-width erreicht ist und dann kommt eine wunderbare scrollbar und so soll es auch sein...

im IE wird so lange verkleinert bis min-width erreicht ist und dann springt der inhalts block einfach nach unten aber da er ja margin 220 hat springt er nicht nach links das währe ja noch ein wenig logisch... er springt einfach nach unten und das würde ich sehr gerne verhindern da das ja überhaupt keinen sinn macht......

kann man das irgendwie verbieten?

[Gernot Back]

Hallo kungschu,

Nichts. Allerdings können die Fehler ja auch anderwo liegen. Sicher hast du auch gelesen, dass der IE<7 width als min-width interpretiert.

Und min-width gar nicht, auch nicht im IE7, wenn es sich nicht gerade um floatende oder absolut positionierte Elemente innerhalb eines mit DOCTYPE strict definierten Dokumentes handelt ...

http://msdn2.microsoft.com/en-us/library/ms530820.aspx

Gruß Gernot

[Inita_]

hi,

das ist mein Beispiel mit min-width, geht ja auch allen neusten Browsern. Viel Spass!

http://inix.blogiem.lv/2007/07/25/8990.html