Changement de ligne en CSS

Changement de ligne en CSS - HTML/CSS - Programmation

Marsh Posté le 27-02-2006 à 16:24:02    

J'essaie autant que je peux d'utiliser le CSS pour faire mes pages mais j'ai quelques problèmes à placer mes éléments dans mes pages.
 
Dans cette page, je peux faire des sauts de ligne et je ne vois pas comment les faire ?  
 
http://www.uqtr.ca/~fourniey/lien.php
 
Dans une autre page, je voudrais mettre une photo et la description du poste à côté et ce pour 3 personnes et je n'y arrive pas car je dois continuellement faire du CSS pour chacune des dispositions voulues.  Est-ce ainsi pour tout le monde ?
 
 
Merci!

Reply

Marsh Posté le 27-02-2006 à 16:24:02   

Reply

Marsh Posté le 27-02-2006 à 16:27:22    

Je répond un peu à côté mais as-tu testé ta page sur plusieurs navigateurs? Parce que sur IE ça passe très bien (comme toujours) mais sous FF un peu moins...

Reply

Marsh Posté le 27-02-2006 à 19:47:45    

Ça ne passe pas bien car le but est que Pour entrainement devrait Être sous les logos à gauche.

Reply

Marsh Posté le 28-02-2006 à 04:05:17    

J'ai fait ma page avec des tables, des tr et td car je ne voyais pas comment le faire en CSS.

Reply

Marsh Posté le 28-02-2006 à 11:11:51    

avec des div par exemple.

Reply

Marsh Posté le 28-02-2006 à 13:15:54    

J'ai plein de div dans mes écrans mais là, ça finit plus, je dois continuellement faire du CSS unique alors qu'avec les tr et tr, cela m'a demandé 10 minutes.

Reply

Marsh Posté le 28-02-2006 à 15:17:29    

Je ne suis que le panneau à la croisée des chemins, seul toi peux choisir lequel tu empruntera.

Reply

Marsh Posté le 28-02-2006 à 22:16:56    

Ton problème de décalage vient de cette partie de ta CSS :

Code :
  1. #content img,#contentalt img{
  2. border:1px solid #fa9035;
  3. float:left;
  4. margin:5px 15px 6px;
  5. }


 
Mets le float: left; en commentaire, tu verras le changement ;)
 
Concernant tes DIV, Alsacreations propose des modèles de mise en page en CSS parmi lesquels tu trouveras certainement ton bonheur (bien que ce que tu as fait n'est pas trop mal même si c'est un peu brouillon ;) )
 
edit :
 
Puis je te propose de remplacer ton paragraphe avec les images séparées par des sauts de ligne...  

Code :
  1. <p>
  2. <center><a href="http://www.soccermauricie.com"><img src="images/partenaires/arsm.jpg" height=15% width=15% alt="Association régionnale"/></a> </center>&nbsp;
  3. <center><a href="http://www.tsisports.ca/sc/soccer/ligue/indexMAU.htm"><img src="images/partenaires/pts.jpg" alt="Résultats des parties de la ligue"/> </a> </center>&nbsp;
  4. <center><a href="http://www.federation-soccer.qc.ca/fre/"><img src="images/partenaires/soccer_qc.gif" alt=""/></a> </center>&nbsp;
  5. <center><a href="http://www.fifa.com/fr/index.html"><img src="images/partenaires/fifa.gif" height=10% width=10% alt=""/></a> </center>&nbsp;
  6. <center><a href="http://www.coupedanonecup.com/main.asp?l=fr&SID=000"><img src="images/partenaires/danone.gif" height=10% width=10% alt=""/></a> </center>&nbsp;
  7. <center><a href="http://www.uqtr.ca/Patriotes/Equipe/"><img src="images/partenaires/pats.gif" height="60" width="70" alt="Patriotes de l'UQTR"/></a> </center>&nbsp;
  8. <center><a href="http://www.canadasoccer.com/fr/index.asp"><img src="images/partenaires/acs.jpg" height="60" width="70" alt="Assocation canadienne de soccer"/></a> </center>&nbsp;
  9. <center><a href="http://www.impactmontreal.com/index_FR.asp"><img src="images/partenaires/impact.gif" height="60" width="70" alt=""/></a> </center>
  10. </p>


 
... Par une liste :

Code :
  1. <ul id="ListeImages">
  2. <li><a href="http://www.soccermauricie.com"><img src="images/partenaires/arsm.jpg" height=15% width=15% alt="Association régionnale"/></a></li>
  3. <li><a href="http://www.tsisports.ca/sc/soccer/ligue/indexMAU.htm"><img src="images/partenaires/pts.jpg" alt="Résultats des parties de la ligue"/></a></li>
  4. <li><a href="http://www.federation-soccer.qc.ca/fre/"><img src="images/partenaires/soccer_qc.gif" alt=""/></a></li>
  5. <li><a href="http://www.fifa.com/fr/index.html"><img src="images/partenaires/fifa.gif" height=10% width=10% alt=""/></a></li>
  6. <li><a href="http://www.coupedanonecup.com/main.asp?l=fr&SID=000"><img src="images/partenaires/danone.gif" height=10% width=10% alt=""/></a></li>
  7. <li><a href="http://www.uqtr.ca/Patriotes/Equipe/"><img src="images/partenaires/pats.gif" height="60" width="70" alt="Patriotes de l'UQTR"/></a></li>
  8. <li><a href="http://www.canadasoccer.com/fr/index.asp"><img src="images/partenaires/acs.jpg" height="60" width="70" alt="Assocation canadienne de soccer"/></a></li>
  9. <li><a href="http://www.impactmontreal.com/index_FR.asp"><img src="images/partenaires/impact.gif" height="60" width="70" alt=""/></a></li>
  10. </ul>


et quelque part dans la CSS :

Code :
  1. #ListeImages{
  2.   text-align: center;
  3. }


Message édité par juju2k le 28-02-2006 à 22:39:44
Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed