28220 sujets

CSS et mise en forme, CSS3

Decalage de colonnes

Salut,
Grrr, je n'arrive a trouver ou je bloque. J'ai un tableau a 3 colonnes. Si je mets une photo trop grande dans la 2eme colonne, cette colonne s'agrandit et empiete sur la 1ere colonne. Comment faire pour que la largeur de cette 1ere colonne reste fixe et que ce soit son contenu qui apparaisse a l'ecran (plutot que le bout de photo qui depasse de la gauche de la 2eme colonne) ?

Merci de votre aide,

Shanghai
Modifié par shanghai (26 Oct 2005 - 22:55)
Salut spirou,
Marche po Smiley decu Voici le code :

<table width="100%" align="center" border="0" cellspacing="0" cellpadding="12">
  <tr>
    <td width="120px" class="sidebarleft" valign="top">
    </td>
    <td width="700px" class="maincontent" valign="top" >
	  <blockquote>
--- texte + la photo qui depasse ---
</blockquote>
    </td>
    <td width="190" class="sidebar" valign="top">
      <p class="mediumheading">news</p>
       </td>
  </tr>
</table>

Et le CSS :

.sidebarleft {
	font-size: 12px;
	font-family: "Comic Sans MS", "Trebuchet MS", Verdana, Arial, sans-serif;
	color: #666666;
	background-color:transparent ; 
	border-width: 1px 0 1px 1px;
	border-style: solid; 
	overflow:hidden;
	border-color: black}
.maincontent {
	font-size: 11pt;
	/*width:500px;*/
	text-indent: 18px;
	text-align: justify;
	line-height: normal;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: black;
	border-width: 1px;
	border-style: solid;
	border-color: #333333;
	background-color: #FEEFCB;
	overflow:hidden;
	}
.sidebar {
	font-size: 12px; 
	font-family: "Comic Sans MS", "Trebuchet MS", Verdana, Arial, sans-serif; 
	color: black; 
	background-color: transparent; 
	border-width: 0; 
	border-style: solid; 
	border-color: black;
	}

Merci !
T'as essayer en enlevant la balise <blockquote> ?

Sinon, je vois pas trop comment faire autrement qu'avec le overflow.

Pourquoi mets tu width entre commentaire, il faut que ton <td> est une taille définie pour que le overflow: hidden puisse être appliqué.
Ca ne marche pas en enlevant le <blockquote>. Pour le width, il est entre /* */ dans le CSS mais est ecris en dur dans la feuille php (je l'integrerai a la fin). C'est vraiment bizarre cette histoire.

Merci quand meme.
Pour preciser, ce qui se passe est que la 2eme colonne s'elargit suffisament pour contenir la grande image et vient donc empieter sur la 1ere colonne. Je ne sais pas si l'attribut "position" peut aider.

Shanghai
Sujet clos
Aller à