28221 sujets

CSS et mise en forme, CSS3

je cherche comme le sujet de ma question l'indique à faire en sorte qu'une balise div se redimensionne lorsque ma fenêtre principale est redimensionnée...

la balise div en question ("hold"...) est intégrée de la façon suivante dans un tableau :

 <table width="100%" style='border:1px groove #AA0000'>
  <tr>
    <td>
	<div id="hold">
	<div id="wn">
		<div id="DIV1" class="content">
			<!-- le contenu de la zone à scroller -->
		</div>	
	</div>
	</div>
     </td>
    <td width="13px"></td>
  </tr>
</table>


et un style lui est appliqué de la façon suivante (dans une feuille externe appelée au chargement de la page) :

div#hold
	{ 
	position:relative; overflow:hidden;
	width:100%; height:200px;
	z-index:100; 
	}


le width:100% étant censé assurer son redimensionnement ...

le reste du CSS est du style :

div#wn	{ 
	position:absolute; 
	left:0px; top:0px; 
	width:900px; height:200px; 
	clip:rect(0px 900px 200px 0px);
	overflow:hidden;	
	z-index:1; 
	}

div.content 	{ 
		position:absolute; visibility:hidden;
		left:0px; top:0px; 
		z-index:1; 
		}



Quand j'agrandis ma fenêtre la div s'agrandit effectivement MAIS quand je rétrécis la fenêtre la div semble se bloquer à une largeur minimale qui est celle qu'elle avait au chargement de la page ... Smiley confus

Ce code fonctionne sous IE mais pas sous mozilla et firefox. De plus sous mozilla le redimensionnement de la div "container" (hold...) ne clippe plus les div incluses à l'intérieur ...

Savez vous pourquoi cela se comporte de de cette façon ?

quand je redimensionne par une fonction du type :

function test()
{
	a=document.getElementById('hold');
	a.style.width="300px";
}


la div se rétrécit correctement et la table que j'indique dans le code peut se redimensionner ...

merci de votre aide !
Modifié par snaileater (16 Feb 2005 - 22:06)
Bonjour snaileater et bienvenue à toi,

Merci de présenter tes codes avec les balises adéquates de la zone d'édition des messages ([ code][ /code] sans les espaces). Cela facilite la lecture de chacun et augmente les chances de réponses Smiley cligne . Tout est indiqué dans Aides/Règles. Pour corriger tu peux éditer ton message (bouton en haut à droite de ton premier message).