Mauvaise position du texte sur une image.
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Problème avec un script, un code :: Archives des problèmes avec un code
Page 1 sur 1 • Partagez
Mauvaise position du texte sur une image.
Bonsoir !
Cela fait déjà un moment que je cherche sans parvenir à trouver une réponse à ma question c'est pourquoi je viens (une nouvelle fois) vers vous =) J'ai donc encore un petit problème, un réglage que je n'arrive pas à corriger, voici une image pour illustrer ce "probème" :
Comme vous pouvez le voir, le texte est situé trop haut mais impossible d'y remédier par le biais du CSS (ou alors, je ne connais pas le code). Du coup, j'imagine qu'il faut toucher au Template et là, j'atteins mes limites ^^' Pourriez-vous m'expliquer où est ce que je peux modifier la position de cette partie du forum ?
Un grand merci d'avance et bonne soirée !
Cordialement
Elliot.
Cela fait déjà un moment que je cherche sans parvenir à trouver une réponse à ma question c'est pourquoi je viens (une nouvelle fois) vers vous =) J'ai donc encore un petit problème, un réglage que je n'arrive pas à corriger, voici une image pour illustrer ce "probème" :
Comme vous pouvez le voir, le texte est situé trop haut mais impossible d'y remédier par le biais du CSS (ou alors, je ne connais pas le code). Du coup, j'imagine qu'il faut toucher au Template et là, j'atteins mes limites ^^' Pourriez-vous m'expliquer où est ce que je peux modifier la position de cette partie du forum ?
Un grand merci d'avance et bonne soirée !
Cordialement
Elliot.
Dernière édition par Elliot. le Mer 30 Mai 2012 - 21:34, édité 1 fois
Elliot.- **
- Messages : 51
Inscrit(e) le : 20/06/2011
Re: Mauvaise position du texte sur une image.
Bonsoir,
Sans votre template et votre CSS, pas facile de savoir. Votre texte s'aligne tout en haut, avez-vous essayé de mettre un "padding-top" important, de 8 ou 10px, dans votre CSS?
Dans le template, la cellule du tableau contenant votre dernier message doit être en valign="top", essayez de mettre valign="middle".
Bien sincèrement.
Sans votre template et votre CSS, pas facile de savoir. Votre texte s'aligne tout en haut, avez-vous essayé de mettre un "padding-top" important, de 8 ou 10px, dans votre CSS?
Dans le template, la cellule du tableau contenant votre dernier message doit être en valign="top", essayez de mettre valign="middle".
Bien sincèrement.
Invité- Invité
Re: Mauvaise position du texte sur une image.
Pff je suis débile, effectivement le "padding-top" fonctionne très bien, je m'entêtais avec un "margin-top" qui ne fonctionnait pas du tout...
Merci beaucoup !
Je profite du message parce que j'ai ce même problème, j'aimerai baisser les noms des forums, ce qui donnerait sur l'image "le règlement" à cheval sur la description du forum, j'ai bien essayé le padding-top mais ça ne fonctionne pas dans ce cas là :S
Voici mon template index-box
puis mon CSS (qui est vraiment bordélique, navrée)
Encore merci pour votre aide !
Merci beaucoup !
Je profite du message parce que j'ai ce même problème, j'aimerai baisser les noms des forums, ce qui donnerait sur l'image "le règlement" à cheval sur la description du forum, j'ai bien essayé le padding-top mais ça ne fonctionne pas dans ce cas là :S
Voici mon template index-box
- Code:
<table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
<tr>
<td valign="bottom">
<!-- BEGIN switch_user_logged_in -->
<span class="gensmall">{LAST_VISIT_DATE}<br />
{CURRENT_TIME}<br />
</span>
<!-- END switch_user_logged_in -->
<div class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}</div>
</td>
<td class="gensmall" align="right" valign="bottom">
<!-- BEGIN switch_user_logged_in -->
<a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a><br />
<a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a><br />
<!-- END switch_user_logged_in -->
<a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a>
</td>
</tr>
</table>
<!-- BEGIN catrow --><!-- BEGIN tablehead -->
<div align="center" width="752px" border="0"><img src="http://img15.hostingpics.net/pics/845063hautclonne1.png" /></div>
<table align="center" class="forumline" width="706px" border="0" cellspacing="1" cellpadding="0">
<tr>
<th colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%" class="secondarytitle"> {catrow.tablehead.L_FORUM} </th>
<th nowrap="nowrap" width="150"><div style="width:155px;"></div></th>
</tr>
<!-- END tablehead -->
<!-- BEGIN cathead -->
<tr>
<!-- BEGIN inc -->
<td class="{catrow.cathead.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
<!-- END inc -->
<td class="{catrow.cathead.CLASS_CAT}" colspan="{catrow.cathead.INC_SPAN}" width="100%">
<h{catrow.cathead.LEVEL} class="hierarchy">
<span class="cattitle">
<a class="cattitle" title="{catrow.cathead.CAT_DESC}" href="{catrow.cathead.U_VIEWCAT}">{catrow.cathead.CAT_TITLE}</a>
</span>
</h{catrow.cathead.LEVEL}>
</td>
<td class="{catrow.cathead.CLASS_ROWPIC}" colspan="3" align="right"> </td>
</tr>
<!-- END cathead -->
<!-- BEGIN forumrow -->
<tr>
<!-- BEGIN inc -->
<td class="{catrow.forumrow.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" alt="." /></td>
<!-- END inc -->
<td class="{catrow.forumrow.INC_CLASS}" align="center" valign="middle">
</td>
<td class="row1 over" colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="100%" height="50">
<h{catrow.forumrow.LEVEL} class="hierarchy">
<span class="forumlink">
<a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a>
</span>
</h{catrow.forumrow.LEVEL}>
<table height="50" width="100%"><tr><td><div><span class="genmed">{catrow.forumrow.FORUM_DESC}</span></div></td><td width="8px"></td><td width="25%"class="sousfo"><span class="gensmall" > <span class="gensmall" id="subforums">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</span><script type="text/javascript">
jQuery('#subforums').html(jQuery('#subforums').html().replace(/, /g,' ')).removeAttr('id');
</script></span>
</td></tr></table>
</td>
<td class="row3 over" align="center" valign="middle" height="50">
<div class="cat3"><span class="gensmall">{catrow.forumrow.LAST_POST} <div style="float: center;"><img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" /></div></span></div>
</td>
</tr>
<!-- END forumrow -->
<!-- BEGIN catfoot -->
<tr>
<!-- BEGIN inc -->
<td class="{catrow.catfoot.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
<!-- END inc -->
<td class="spaceRow" colspan="{catrow.catfoot.INC_SPAN}" height="1"><img src="{SPACER}" alt="" height="1" width="1" /></td>
</tr>
<!-- END catfoot -->
<!-- BEGIN tablefoot -->
</table><div align="center" width="752px" border="0"><img src="http://img15.hostingpics.net/pics/828983bascolonne1.jpg"/></div><img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow -->
puis mon CSS (qui est vraiment bordélique, navrée)
- Code:
*/ PAGE D ACCUEIL */
.contenupa {
background-color:
#E8E89F;
text-align: justify;
}
.titrePA {
color:
#FA8228;
font-family: arial;
font-size: 20px;
font-style: italic;
font-weight: 700;
position: relative;
top: 10px;
}
.menu {
font-family: georgia;
font-size: 22px;
font-style: italic;
text-shadow: 0px 0px 2px #fff;
text-align: center;}
.imagepa {border: 3px #fff solid;}
.alattaque {color: #ffffff;
font-style: italic;
font-weight: bold;
font-size: 30px;
letter-spacing: -1px;
font-family: arial;
text-transform: lowercase;
margin-bottom: -10px;
}
hr {border: #fff 1px dashed;}
--------------------------
*/ categorie */
.sep{
border-right: 15px solid #fff;/*épaisseur style et couleur de la ligne*/
}
.titrecat {
margin-left: 150px;
margin-top: -100px;
width: 50px;
}
.sousfo{background-color: #E8E89F;
padding: 5px;
color: #D57C04;
text-transform: lowercase;
text-decoration: none;
font-size: 9px;
height:50px;
overflow:auto;}
.cat3 {
background-image: url('http://img15.hostingpics.net/pics/198046bulle.png');
background-position: top-center;
background-repeat: no-repeat;
line-height: 10px;
width: 130px;
margin: 5px;
height: 142px;
text-align: center;
padding-top: 15px;
}
.description {
background-color: #E8E89F;
padding: 10px;
text-align: justify;
width: auto;
height: 50px;
overflow: auto;
border-left: 4px solid #D57C04;
border-right: 4px solid #D57C04;
color: #B0915B;
font-size: 11px;
-webkit-box-shadow: rgb(151, 148, 143) 0px 0px 4px;}
a.forumlink {
font-size: 30px;
letter-spacing: -2px;
font-family: arial;
text-transform: lowercase;
margin-left: 20px;
}
----------------------------------
*/ QEEL */
.col1, .col2, .col3 {
font-family: arial;
height: 240px;
text-align: justify;
border: none;
background: #transp;
padding: 10px;}
.col {background: #e8e89f; padding: 10px; text-align: justify; height: 250px;}
--------------------------------------------
#text_editor_iframe, input, select, textarea {background-color: #1C150C; border: 2px solid;}
.last-post-icon {margin-left: 20px; margin-top: 10px;}
.nameprofile {
font-family: Arial Black; font-weight: bold;
text-transform: uppercase;
font-size: 15px;
text-shadow: 2px 2px 0px #000;
}
.rang {color: #D8CDB1;}
.message {background-image:url('http://img4.hostingpics.net/pics/5947155895.jpg'); -moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px; color: #826241; padding: 10px; }
.fond2, .presentation2 {padding: 20px; text-align: justify; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px;
background-color:#261D12;}
.titre1, .prenom {color: #FFF; text-align: center; font-weight: normal; font-family: georgia; font-size: 40px; letter-spacing: 1px; text-transform: lowercase; line-height: 30px;}
.fond1, .presentation1 {margin-top: 6px; margin-bottom: 6px; margin-right: 16px; margin-left: 16px; padding: 12px;
background-image:url('http://img4.hostingpics.net/pics/5947155895.jpg');
-moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px;
background-color: #C3B18B;}
.soustitre1 {font-family: Georgia; font-size: 22px; font-style: italic; text-transform: lowercase; letter-spacing: -1px; text-align: center; padding: 5px; color: #C3B18B;}
.profil {display:block; color: #c3b18b; font-size: 12px; padding: 10px;
-moz-border-radius: 5px 5px 5px 5px; -webkit-border-radius: 5px 5px 5px 5px; border-radius: 5px 5px 5px 5px;
background-image: url('http://img4.hostingpics.net/pics/5947155895.jpg');}
.postdetails, .poster-profile {color: #432711;}
.img2:hover {
opacity: 1;
filter: alpha(opacity=100);
-moz-opacity: 1;
-khtml-opacity: 1;
}
.img2 {
opacity: 0.5;
filter: alpha(opacity=55);
-moz-opacity: 0.5;
-khtml-opacity: 0.5;
}
.code, .citation {padding: 10px;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
-webkit-box-shadow: 0px 0px 10px #948463, 0px 0px 5px #948463 inset;
-moz-box-shadow: 0px 0px 10px #948463, 0px 0px 5px #948463 inset;
border: 3px solid #FFFFFF;}
.forumline {border-top: none; }
.encadrement {padding: 5px; overflow: auto;
background-color : #F0E8D3;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
-webkit-box-shadow: 0px 0px 10px #948463, 0px 0px 10px #948463 inset;
-moz-box-shadow: 0px 0px 10px #948463, 0px 0px 10px #948463 inset;
border: 3px solid #FFFFFF;}
.lienrapide {padding: 5px; text-shadow: 1px 1px 1px #8f5624;
margin: 2px;
FONT-WEIGHT: bold;
text-align:center;
text-decoration: none !important;
font-family: georgia;
font-style: italic;
text-transform: lowercase;
font-size: 25px;
letter-spacing: 2px;}
a.gensmall, a.gensmall:hover {color: #D57C04; text-align: center; text-decoration: none;}
tr.post span.gensmall { display: none; }
A:link {text-decoration: none !important;}
A:visited {text-decoration: none !important;}
A:active {text-decoration: none !important;}
A:hover {text-decoration: none !important;}
.postbody {
display: block;
padding-left: 20px;
padding-right: 20px;
text-align:justify !important;
}
.mainmenu{
font-style:italic ;}
.groupes, .groupes2{
padding: 5px;
margin: 2px;
text-align:center;
text-decoration: none !important;
font-family: georgia;
font-style: italic;
text-transform: lowercase;
font-size: 16px;
letter-spacing: 2px;
}
Encore merci pour votre aide !
Elliot.- **
- Messages : 51
Inscrit(e) le : 20/06/2011
Re: Mauvaise position du texte sur une image.
Essayez avec ce template:
Ajoutez ensuite ceci dans votre CSS:
Bien sincèrement.
- Code:
<table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
<tr>
<td valign="bottom">
<!-- BEGIN switch_user_logged_in -->
<span class="gensmall">{LAST_VISIT_DATE}<br />
{CURRENT_TIME}<br />
</span>
<!-- END switch_user_logged_in -->
<div class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}</div>
</td>
<td class="gensmall" align="right" valign="bottom">
<!-- BEGIN switch_user_logged_in -->
<a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a><br />
<a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a><br />
<!-- END switch_user_logged_in -->
<a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a>
</td>
</tr>
</table>
<!-- BEGIN catrow --><!-- BEGIN tablehead -->
<div align="center" width="752px" border="0"><img src="http://img15.hostingpics.net/pics/845063hautclonne1.png" /></div>
<table align="center" class="forumline" width="706px" border="0" cellspacing="1" cellpadding="0">
<tr>
<th colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%" class="secondarytitle"> {catrow.tablehead.L_FORUM} </th>
<th nowrap="nowrap" width="150"><div style="width:155px;"></div></th>
</tr>
<!-- END tablehead -->
<!-- BEGIN cathead -->
<tr>
<!-- BEGIN inc -->
<td class="{catrow.cathead.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
<!-- END inc -->
<td class="{catrow.cathead.CLASS_CAT}" colspan="{catrow.cathead.INC_SPAN}" width="100%">
<h{catrow.cathead.LEVEL} class="hierarchy">
<span class="cattitle">
<a class="cattitle" title="{catrow.cathead.CAT_DESC}" href="{catrow.cathead.U_VIEWCAT}">{catrow.cathead.CAT_TITLE}</a>
</span>
</h{catrow.cathead.LEVEL}>
</td>
<td class="{catrow.cathead.CLASS_ROWPIC}" colspan="3" align="right"> </td>
</tr>
<!-- END cathead -->
<!-- BEGIN forumrow -->
<tr>
<!-- BEGIN inc -->
<td class="{catrow.forumrow.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" alt="." /></td>
<!-- END inc -->
<td class="{catrow.forumrow.INC_CLASS}" align="center" valign="middle">
</td>
<td class="row1 over" colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="100%" height="50">
<table height="50" width="100%"><tr><td><div class="titrefo"><h{catrow.forumrow.LEVEL} class="hierarchy">
<span class="forumlink">
<a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a>
</span>
</h{catrow.forumrow.LEVEL}></div>
<div><span class="genmed">{catrow.forumrow.FORUM_DESC}</span></div></td><td width="8px"></td><td width="25%"class="sousfo"><span class="gensmall" > <span class="gensmall" id="subforums">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</span><script type="text/javascript">
jQuery('#subforums').html(jQuery('#subforums').html().replace(/, /g,' ')).removeAttr('id');
</script></span>
</td></tr></table>
</td>
<td class="row3 over" align="center" valign="middle" height="50">
<div class="cat3"><span class="gensmall">{catrow.forumrow.LAST_POST} <div style="float: center;"><img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" /></div></span></div>
</td>
</tr>
<!-- END forumrow -->
<!-- BEGIN catfoot -->
<tr>
<!-- BEGIN inc -->
<td class="{catrow.catfoot.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
<!-- END inc -->
<td class="spaceRow" colspan="{catrow.catfoot.INC_SPAN}" height="1"><img src="{SPACER}" alt="" height="1" width="1" /></td>
</tr>
<!-- END catfoot -->
<!-- BEGIN tablefoot -->
</table><div align="center" width="752px" border="0"><img src="http://img15.hostingpics.net/pics/828983bascolonne1.jpg"/></div><img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow -->
Ajoutez ensuite ceci dans votre CSS:
- Code:
.titrefo{margin-bottom: -15px;}
Bien sincèrement.
Invité- Invité
Re: Mauvaise position du texte sur une image.
Ca fonctionne parfaitement ! Merci beaucoup pour l'aide et les conseils
Elliot.- **
- Messages : 51
Inscrit(e) le : 20/06/2011
Sujets similaires
» Mauvaise visibilité du texte.
» Texte de la mauvaise couleur sous l'avatar
» Position du texte
» Position du texte.
» Position texte/description de l'auteur dans un sujet
» Texte de la mauvaise couleur sous l'avatar
» Position du texte
» Position du texte.
» Position texte/description de l'auteur dans un sujet
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Problème avec un script, un code :: Archives des problèmes avec un code
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum