min-width

**slowpoke** · 15.08.2007 13:39

Hallo zusammen,
ich habe ein Problem. Eine Website die ich erstellt habe funktioniert mit Firefox, aber der IE will nicht so recht.

Das Problem ist das "min-width" das ich vergeben habe, das aber vom IE nicht akzeptiert wird. Ich habe mich im Internet schlau gemacht und gegooglet, und auch einiges gefunden. Ich habs trotzdem nicht geschafft

Könnte mir jemand in das Dokument schreiben wie es sein muss, sodass die Navigation links nicht verkleinert wird wenn das Fenster kleiner gemacht wird?

Und wenn jemand noch Zeit hat, auf mein Dokument abgestimmt erklären was er getan hat? Aber am wichtigsten ist mir, dass es erst einmal funktioniert

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" />
<meta name="description" content="-----------" />
<meta name="description" content="--------" />
<meta name="author" content="---------" />
<meta name="keywords" content="--------" />


<title>Titel der Seite</title>
<style type="text/css">
<!--
#container {
position: absolute;
top: 110px;
left: 1022px;
width: 1.5px;
height: 18px;
border:none;
background-color:#CFF0D4
}

#container2 {
position: absolute;
top: 110px;
left: 170px;
width: 1.5px;
height: 18px;
border:none;
background-color:#CFF0D4
}



#navi {
min-width:170px
}

a {text-decoration: none; color:#FF0000}
a:visited {color:#CFF0D4}
a:hover {color:#FFFFFF}
a:active {color:#CFF0D4}
a:link {color: #CFF0D4}



-->
</style>
</head>

<body bgcolor="#8F8AFD" leftmargin="0" marginwidth="0" marginheight="0" topmargin="0">

<table width="1024" border="0" cellpadding="0" cellspacing="0">

<!--HEADER-->

<tr>
<td height="40" bgcolor="#E7F8E9" width="170">

	<span style="font-family:Verdana, Arial, 'Times New Roman'; font-size:12px">
		
			
		</span>
		</td>



<td bgcolor="#FFFFFF" width="854" height="40" style="padding-left:0mm">

<img src="bilder\banner2.jpg" width="855" height="97" align="left" /></td>


</tr>

</table>


<!--link_HEADER-->
<table bgcolor="#8F8AFD" width="100%" height="40" cellpadding="0" cellspacing="0">
<td>
<div style="padding-left:44mm">

<span style="font-family:Verdana, Arial, 'Times New Roman'; font-size:18px; color:#CFF0D4; font-variant:small-caps;">

&nbsp;&nbsp; -----------------

</span>


<span style="font-family:Verdana, Arial, 'Times New Roman'; font-size:16px; color:#CFF0D4; letter-spacing:3px">

-----------------  

</span>

</div>

<div id="container" style="color:#0000FF" border-style="none"></div>
<div id="container2" style="color:#0000FF" border-style="none"></div>


</td>
</table>


<!--Mid-->


<table cellpadding="0" cellspacing="0">

<tr>
<td width="170" height="100" valign="top" bgcolor="#8F8AFD">

<br />
<br />

<div id="navi">
  <p style="font-family:Verdana, Arial, 'Times New Roman'; font-size:14px; color:#CFF0D4; line-height:180%; padding-left: 8mm">
    
   	<a href="index.html" style="padding-left:6mm; font-weight:bold"> Startseite </a>
  
  	<br />
    
    <a href="kurse.html"> ---- </a>
    
  	<br />
    
    <a href="kontakt.html"> ---- </a> 
	
	<br />
	
    <a href="impressum.html"> ---- </a> 
	</p>
  </div>



</td>



<td bgcolor="#C1BCFE" width="855" height="660" valign="top">
	<div align="left" style="padding-left:2cm; padding-top:0.6cm">
	<span style="font-family:Verdana, Arial, 'Times New Roman'; font-size:14px; vertical-align:top; line-height:180%;">
			
		<p style="font-weight:bold"> ------ </p>
		
		<br />
	
		<p style="padding-right: 2cm"> -----------------
		
		----------------------------------
		
		</p>

		
		</span> 
		</div>
		
	<br />
	
			<div style="min-width:39%; min-height:40%; font-family="Verdana, Arial, 'Times New Roman'; font-size=12px; padding-right:2cm">
			
		<img src="bilder\foto.jpg" hspace="15px" class="bild" border="0" style="width:39%; height:40%; align:right; padding-left:2cm; 
		float:left;"/>

	
	
	<p style="font-family:Verdana;Arial;'Times New Roman'; font-size:14px; padding-right:2cm; padding-left:2cm; line-height: 180%">
	----------------- </p>
	</td>


</tr>



<!--BOTTOM-->

<tr>
<td bgcolor="#8F8AFD" width="116" height="30"> 
  <div align="center">
  <span style="font-family:Verdana, Arial, 'Times New Roman'; font-size:12px">
    
	    
	</span>  
	</div>
	</td>



<td bgcolor="#C1BCFE" width="854" height="30">
	<div align="center">
	<span style="font-family:Verdana, Arial, 'Times New Roman'; font-size:12px">
		
			
		</span>	
	  </div>
	</td>



</tr>



</table>
</body>
</html>

P.S: Im Anhang als Dokument.

Vielen Dank
Slowpoke

**Stefan** · 15.08.2007 13:46

Hab' grad wenig Zeit, aber vom Prinzip her musst du die min-width Angabe drinlassen, aber zusätzlich noch ein Conditional Comment hinzufügen. CCs sind Angaben, die nur von bestimmten Browsern, also in unserem Fall der IE, interpretiert werden. Von Firefox und Co werden sie schlichtweg ignoriert.

Zitat von Beispiel

#divname{min-height:230px;}

* html #content { height:230px; }

Dadurch wird erreicht, dass Firefox und Co, die das Min-Height richtig interpretieren, es auch interpretieren. IE versteht diesen Tag jedoch nicht und übernimmt die Höhenangabe nicht. Abhilfe schafft das CC, das dem IE sagt, er sollte die entsprechende Höhe übernehmen.

Im Gegensatz zum Firefox interpretiert der IE "height" als variable Höhe. Ist der Inhalt höher, dann wird der Div automatisch vergrößert. Beim FF hingegen ist die Höhe dann fixiert und der Inhalt "fließt" drüber. Kurzum: Height wird vom IE interpretiert wie vom Firefox min-height.

Mit width sollte es gleich sein.

Korrigiert mich, wenn ich falsch liege, hatte die Problematik mal bei ner Webseite

Gruß Stefan

**webcreate** · 15.08.2007 14:07

Das ganze ist nur kein CC, sondern ein child-selector-hack

Sonst gibt es da noch das und das zu lesen

**slowpoke** · 15.08.2007 14:16

Das was im ersten der beiden links steht, hatte ich auch gefunden, komme aber nicht ganz damit klar, welche Werte ich wo einsetzen muss.

**slowpoke** · 15.08.2007 15:21

Krieg ich nicht hin

, sry.

Kann mir das einer kurz ins skript schreiben, dann kann ich da ja rumprobieren und nachvollziehen, ich habs jetzt zig mal ausprobiert...Keine Ahnung wieso es nicht klappt.

Gruß
Slowpoke

**Stefan** · 15.08.2007 16:53

Einfach:

#navi {
min-width:170px
}

* html #navi { width: 170px; }

Also die letzte Zeile musst du ergänzen. Bei mir funktionier's.

@ webcreate: Danke für den Hinweis, hab's verwechselt. Bzw. ich kannte keine andere Bezeichnung

**slowpoke** · 15.08.2007 17:24

Geschafft

Vielen dank. Ich hab' es mit * eingegeben, das war der Fehler... Als ich es ohne versucht hab hats plötzlich geklappt.

Sollte das ein Zeichen für "Hier ergänzen" sein, das ich nicht als solches erkannt habe, obwohl es im Nachhinein einleuchtet, oder gehört das wirklich zum Code?

**Stefan** · 15.08.2007 17:48

Der Stern? Klar gehört der dazu! Siehe z.b. hier

**slowpoke** · 15.08.2007 17:51

Aber MIT stern geht es bei mir nicht

Ohne schon.

HTML-Code:

#navi {
min-width:170px
}

html #navi { width: 170px; }

Bei mir sieht es jetzt so aus.
Und es klappt.

**Stefan** · 15.08.2007 18:04

Darf ich fragen, welche IE Version du hast?

**slowpoke** · 15.08.2007 19:21

Die neueste. Ist meine ich Version 7.
In Version 6 geht es aber auch ohne Sternchen, war grad' schnell en meinem anderen Rechner.

zur Startseite vom TP

Thema: min-width

LinkBack

Themen-Optionen

Thema durchsuchen

Thema bewerten

min-width

Aktive Benutzer

Aktive Benutzer

Berechtigungen