28220 sujets

CSS et mise en forme, CSS3

DIV et overflow-x sous ie

Bonjour,

J'aurais souhaiter faire exactement ça :

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa


Juste en DIV avec un overflow-x seulement (hauteur adaptive).

Ca marche impec sous firefox mais pas sous ie. Je précise que le veux que la tille du DIV soit adaptée à la taille de la table.


<table width="99%" cellspacing="1" cellpadding="5" border="0" bgcolor="#8E8E8E" align="center">
  <tr>
    <td class="coderow">
      <div style="scrollbar-base-COLOR: #505050; height: 100%; border: 0px solid; position: relative ! important; overflow-x: auto">
         <nobr>aaa...aaa</nobr>
       </div>
     </td>
  </tr>
</table>


En fait sous ie le cadre s'allonge à la taille de la plus grande ligne sans scrollbar et moi je veux la scrollbar horizontale, même sous ie lol.


Quelqu'un peut-il éclairer ma lanterne ?
Modifié par FRUiT (22 Feb 2006 - 17:36)
En fait c'est la largeur qui m'intéresse. Pour la hauteur pas de soucis. Je corrigerais quand même.

Si je définis une largeur fixe en pixels, ça peut marcher, seulement moi je veux que mon DIV soit adapté en largeur à la largeur de la table, avec un overflow-x.

Intéressant ton fil je garde Smiley cligne
Modifié par FRUiT (22 Feb 2006 - 12:37)
Bah t'as essayé avec un width:100% sur ton div ?
D'ailleurs tu nous montre un bout de code avec un overflow-y, y a pas comme une erreur ? ;P
Modifié par Nigel (22 Feb 2006 - 15:05)
Nigel a écrit :
Bah t'as essayé avec un width:100% sur ton div ?
D'ailleurs tu nous montre un bout de code avec un overflow-y, y a pas comme une erreur ? ;P

Heuuuuu oui effectivement j'ai corrigé le code et j'avais corrigé depuis.

Mon exemple marche SUPER bien sous firefox: le DIV et la table sont adaptés à la fenêtre, avec scrollbar horizontale.

DES que je passe sous IE, et que je mets une width relative (=100%), le DIV s'adapte a la largeur du texte contenu, et non à la largeur de son contenant la table.

Ce qui me fait une fenêtre de IE avec une scrollbar horizontale et une page suuuuuper large. Alors que je voudrais que ce soit mon DIV qui ait une scrollbar...

Des que je repasse le width en pixels, ça marche, mais là mon DIV a une taille fixe ne dépendant ni de la table ni de la feuille..............




En fait pour expliquer un peu, je construis un forum en phpBB gratuit chez l'hébergeur xooit.

Pour les fenêtres de code, je voudrais une largeur relative à la taille des cellules des messages, sans troncature des lignes de code.

Exactement comme ici en somme sauf qu'ici, les fenêtres de code ont une largeur fixe, moi je la veux "adaptive".

Voilà ce que j'ai réussi à faire en taille fixe :
http://secteur7.xooit.com/t3-Nettoyage-de-disque-balaise-%28Clean.cmd%29.htm#186
Modifié par FRUiT (22 Feb 2006 - 18:07)
Est-ce que je peux indiquer au div de prendre la largeur de la table, en récupérant cette largeur plutôt qu'en mettant width="100%" ?? Et comment ?

Je ne comprends toujours pas pourquoi ça marche sous firefox et non sous ie. Je fais des recherches google par millions mais ça donne rien.....
Modifié par FRUiT (23 Feb 2006 - 14:59)
Je mets le code de mon fichier tpl pour les fenêtres de code des messages du forum :

<!-- BEGIN code_open --></span>
<table id="codetbl" width="100%" cellspacing="0" cellpadding="0" border="0" align="center">
  <tr>
    <td width="100%" height="100%">
      <table width="100%" cellspacing="1" cellpadding="5" border="0" bgcolor="#8E8E8E" align="left" style="margin-left: 10px;">
        <tr> 
	  <td class="catrow"><span class="smalltext"><b>{L_CODE}:</b></span></td>
	</tr>
	<tr>
	  <td class="coderow" height="100%">
             <div style="scrollbar-base-COLOR: #505050; height: 100%; width: auto; border: Opx solid; overflow-x: auto; position: relative; margin-bottom: 20px">
              <nobr><!-- END code_open --><!-- BEGIN code_close -->
              </nobr>
            </div>
          </td>
        </tr>
      </table>
    </td>
  </tr>
</table>
<span class="largetext"><!-- END code_close -->


Alors quelques précisions.

D'abord l'exemple, ouvrez cette page sous firefox :

http://secteur7.xooit.com/t3-Nettoyage-de-disque-balaise-%28Clean.cmd%29.htm#186

Redimensionnez la fenêtre de firefox horizontalement. Vous pouvez constater que les fenêtres de code s'adaptent à la largeur générale de ses parents, avec apparition d'une barre de scrolling horizontale si le contenu est trop grand (il est non tronqué et doit le rester).

Ouvrez maintenant cette page sous ie. La fenêtre de code ne s'adapte pas à la largeur de ses parents, mais à la largeur de son contenu (enfant). Et tous les parents de la fenêtre de code s'élargissent à la taille de ce contenu (dans le nobr)...

Comment inverser ce processus et ainsi retrouver des propriétés identiques à firefox ?

(et si quelqu'un a la bonté de tester sous netscape ou opera et dire comment ça se comporte, je serais bienheureux)
Modifié par FRUiT (23 Feb 2006 - 19:43)
Sujet clos
Aller à