Overflow auto qui ne fonctionne pas?

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Overflow auto qui ne fonctionne pas?

Message par LA.Virus Jeu 28 Juil 2011 - 20:13

Bonsoir!

Alors cet après-midi je me suis lancée dans mon premier codage de page d'accueil, et je dois dire que je suis assez fière! Mais au dernier moment, lorsque je place l'overflow pour faire un test, je vois que ça ne fonctionne pas, et que ça me donne ceci:
Je dois très certainement l'avoir mal placé..



Je souhaiterai un overflow automatique pour les 4 cases de droite.

Voici le html:

Code:
<div style="background-color: #D4AAAE; border-top 4px #000000; border-bottom: 4px #000000; padding: 30px; -moz-box-shadow: black 1px 1px 8px; -webkit-box-shadow: black 1px 1px 8px; box-shadow: black 1px 1px 8px; -border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #D4AAAE;"> <div style="TEXT-ALIGN: center; align=center;text-shadow: #000000 1px 1px 5px;"><span style="FONT-FAMILY: Arial"><font size="8" face="Georgia"><i><font color="#000000">

<font color="white">❝</font>Bienvenue,
<font color="white"><span style="font-size: 29px; line-height: normal"><br>à la Résidence Yamaguchi</span></font></font></i></font></span><br></div> <div style="BACKGROUND-COLOR: none; TEXT-ALIGN: center;  border-top: 7px solid black; border-bottom: 5px dashed #D4AAAE"></div>
<table border="0" cellspacing="15">
<td> <div style="height: 300px; width: 220px; background-color: #FFFFFF;"><div style="TEXT-ALIGN: center; align=center;text-shadow: #D5AAAE 1px 1px 5px;"><span style="FONT-FAMILY: Arial"><font size="4" face="Georgia"><i><font color="#D4AAAE">
<font color="white">❝</font>Le staff,
<font color="white"><br>là pour vous.</font></font></i></font></span><br></div> <div style="BACKGROUND-COLOR: none; TEXT-ALIGN: center;  border-top: 7px solid black; border-bottom: 5px dotted #D4AAAE"></div>
~ LES ADMINS.<br><div class="infobulle"><img src="http://i42.servimg.com/u/f42/11/52/76/47/10010010.png">
<span>TYREN A. BLAKE.
Fonda - ...</span></div><div class="infobulle"><img src="http://i42.servimg.com/u/f42/11/52/76/47/imagep10.png">
<span>HORIDE ISUZU.
Fonda - ...</span></div>

<p>~LES MODOS.</p>
IMG IMG.</div></td></table>
<td><table border="0" cellspacing="15">
<tbody><tr><td> <div style="background-color: #D4AAAE; border-top 4px #000000; border-bottom: 4px #000000; padding: 30px; -moz-box-shadow: black 1px 1px 8px; -webkit-box-shadow: black 1px 1px 8px; box-shadow: black 1px 1px 8px; -border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #D4AAAE;"> <div style="TEXT-ALIGN: center; align=center;text-shadow: #000000 1px 1px 5px;"><div style="height: 150px; width: 200px; background-color: #FFFFFF;"><div style="TEXT-ALIGN: center; align=center;text-shadow: #D5AAAE 1px 1px 5px;"><span style="FONT-FAMILY: Arial"><font size="4" face="Georgia"><i><font color="#D4AAAE">
<font color="white">❝</font>Nouveautés,
<font color="white"><br>&amp; annonces.</font></font></i></font></span><br></div> <div style="BACKGROUND-COLOR: none; TEXT-ALIGN: center;  border-top: 7px solid black; border-bottom: 5px dotted #D4AAAE"></div><div style="overflow: scroll;">BLABLABLABLABLA BLABLABLABLABLA BLABLABLABLABLABLAB  LABLABLABLABLABLABLA BLABLABLABLABLABLA  BLABLABLABLABLABLA BLABLABLABLABLABLA BLABLABLABLA BLABLABLAB LABLABLA  BLABLABLABLAB LABLABL ABLABL ABLABLA</div></div> </td></div>

<td> <div style="background-color: #D4AAAE; border-top 4px #000000; border-bottom: 4px #000000; padding: 30px; -moz-box-shadow: black 1px 1px 8px; -webkit-box-shadow: black 1px 1px 8px; box-shadow: black 1px 1px 8px; -border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #D4AAAE;"> <div style="TEXT-ALIGN: center; align=center;text-shadow: #000000 1px 1px 5px;"><div style="height: 150px; width: 200px; background-color: #FFFFFF;"><div style="TEXT-ALIGN: center; align=center;text-shadow: #D5AAAE 1px 1px 5px;"><span style="FONT-FAMILY: Arial"><font size="4" face="Georgia"><i><font color="#D4AAAE">
<font color="white">❝</font>Naviguation,
<font color="white"><br>liens rapides.</font></font></i></font></span><br></div> <div style="BACKGROUND-COLOR: none; TEXT-ALIGN: center;  border-top: 7px solid black; border-bottom: 5px dotted #D4AAAE"></div></div> </td></tr></tbody></table></div>

<table border="0" cellspacing="15">
<tbody><tr><td><div style="background-color: #D4AAAE; border-top 4px #000000; border-bottom: 4px #000000; padding: 30px; -moz-box-shadow: black 1px 1px 8px; -webkit-box-shadow: black 1px 1px 8px; box-shadow: black 1px 1px 8px; -border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #D4AAAE;"> <div style="TEXT-ALIGN: center; align=center;text-shadow: #000000 1px 1px 5px;"> <div style="height: 150px; width: 200px; background-color: #FFFFFF;"><div style="TEXT-ALIGN: center; align=center;text-shadow: #D5AAAE 1px 1px 5px;"><span style="FONT-FAMILY: Arial"><font size="4" face="Georgia"><i><font color="#D4AAAE">
<font color="white">❝</font>Partenaires,
<font color="white"><br>les VIP.</font></font></i></font></span><br></div> <div style="BACKGROUND-COLOR: none; TEXT-ALIGN: center;  border-top: 7px solid black; border-bottom: 5px dotted #D4AAAE"></div></div> </td></div>
<td> <div style="background-color: #D4AAAE; border-top 4px #000000; border-bottom: 4px #000000; padding: 30px; -moz-box-shadow: black 1px 1px 8px; -webkit-box-shadow: black 1px 1px 8px; box-shadow: black 1px 1px 8px; -border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #D4AAAE;"> <div style="TEXT-ALIGN: center; align=center;text-shadow: #000000 1px 1px 5px;"><div style="height: 150px; width: 200px; background-color: #FFFFFF;"><div style="TEXT-ALIGN: center; align=center;text-shadow: #D5AAAE 1px 1px 5px;"><span style="FONT-FAMILY: Arial"><font size="4" face="Georgia"><i><font color="#D4AAAE">
<font color="white">❝</font>Votes,
<font color="white"><br>& crédits.</font></font></i></font></span><br></div> <div style="BACKGROUND-COLOR: none; TEXT-ALIGN: center;  border-top: 7px solid black; border-bottom: 5px dotted #D4AAAE"></div></div> </td></div></table>


</tr></td></table></tbody>

</div></div></div>

Au passage, j'aimerai mettre les deux images d'admin côte à côte, avec un tout petit espace entre elles, pour pouvoir mettre l'image du modo en dessous sans que ça dépasse, et sans pour autant devoir agrandir l'espace.

Et enfin, moins important. Mes titres (bienvenue, navig etc) sont censés se chevaucher. Vous voyez, le rose au dessus, et le blanc en dessous mais qui revient un peu sur le rose. Je sais que mon code est juste, mais étrangement il ne fonctionne pas ici... C'est beaucoup moins important que les deux autres requêtes, donc au pire, pas besoin. ^^

Merci à celui ou celle qui va me répondre (:


Dernière édition par LA.Virus le Ven 29 Juil 2011 - 22:09, édité 1 fois
avatar

LA.Virus
Nouveau membre

Messages : 21
Inscrit(e) le : 04/11/2007

http://red-yamaguchi.forumactif.com/
LA.Virus a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Overflow auto qui ne fonctionne pas?

Message par Invité Jeu 28 Juil 2011 - 21:54

Bonjour,

Cela fait beaucoup de questions pour un seul sujet, Wink à l'avenir pensez à ne mettre qu'une question par sujet afin de faciliter les recherches ultérieures.

Concernant, l'overflow, avez vous essayé en lui donnant une hauteur maximale et en remplaçant scroll par auto? C'est à dire remplacer <div style="overflow: scroll;"> par <div style="height: 100px; overflow: auto;"> . J'ai mis une hauteur de 100 px, à vous de voir la hauteur qui convient davantage à votre codage.

Pour les 2 images cote à cote, pourquoi en pas faire un petit tableau à 2 cases? Vous pouvez tenter aussi de les placer à l'aide de la propriété float. <div style="float: left;">image 1</div><div style="float: right;">image 2</div>.

Cordialement.
Anonymous

Invité
Invité


Invité a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Overflow auto qui ne fonctionne pas?

Message par LA.Virus Ven 29 Juil 2011 - 22:09

Désolé, puisque tout cela concernait la même page d'accueil, j'ai trouvé cela plus soigné de tout joindre dans un topic.

Votre conseil pour l'overflow fonctionne à merveille, merci beaucoup. Je tenterai le système du tableau demain...

On peut dire que c'est résolu ^^
avatar

LA.Virus
Nouveau membre

Messages : 21
Inscrit(e) le : 04/11/2007

http://red-yamaguchi.forumactif.com/
LA.Virus a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut

- Sujets similaires

Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum