Largeur du forum...

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

Résolu Largeur du forum...

Message par Angie Dalton le Mar 30 Juil 2013 - 17:23

Bonjour tout le monde.

Je ne savais pas trop vers qui me tournée parce que je commence à douter de pouvoir résoudre ce problème....

Il y'a quelque temps j'ai décider de faire en sorte que mon forum est plus de visiteur et est commencer à mettre du codage pour un PA, pour le Profil etc...

Mais pour une raison indéterminée la largeur du forum a changer alors que je n'est en aucun cas changer la largeur dans le PA.

Voici déjà un aperçu de ce que je vois sur l'écran de mon petit notebook:



Comme vous pouvez le constater mon forum est grand la largeur est trop par rapport à l'écran ce qui assez pénible.

Sachez que la largeur au départ étais à 68%...la cela ne change pas car elle est à 10%...mis 'ai remarqué que pendant 1 seconde lors de l'affichage du forum la largeur étais correct mais cela revient tout de site à la largeur initial.

Je me demande si cela à un rapport avec le codage du profil..si oui voici les Template et CSS modifier complet:

Template Index_box
Spoiler:

<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 --><table class="forumline" width="100%" 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:150px;">{L_LASTPOST}</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">
<img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
</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">
<table width="100%"><tr><td><a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a></td><td align="right"><span class="gensmall"><b>Sujets :</b> {catrow.forumrow.TOPICS} | <b>Messages :</b> {catrow.forumrow.POSTS}</span></td></tr></table><br />
</span>
</h{catrow.forumrow.LEVEL}>
<span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
<span class="gensmall">
<!-- BEGIN switch_moderators_links -->
{catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
<!-- END switch_moderators_links -->
{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
</span>
</td>


<td class="row3 over" align="center" valign="middle" height="50">
<span class="gensmall">{catrow.forumrow.LAST_POST}</span>
</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><img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow -->

feuille CSS

Spoiler:

body {
background-repeat: no-repeat;
}



.mainmenu{
background: #4D0000;
-moz-border-radius:10px 10px 0px 0px;
-webkit-border-radius:10px 10px 0px 0px;
border-radius:10px 10px 0px 0px;
font-family: Georgia, Verdana, Arial, serif;
font-size: 11px;
text-align: center;
padding:0px;
}








/* TITRE FORUMS */
       a.forumlink { font-family: georgia;
       font-size: 17px;
       letter-spacing:1px;
       font-weight: bold;
       font-style: italic;
       text-shadow: 1px 1px 1px #000000;
       border-bottom: solid #000000;
       display: block;
       padding-left: 75px; }



.postbody {padding-left:20px;}




/* ************* LIMITER LA TAILLE DES IMAGES DANS LES SIGNATURES *********** */

.signature_div img {

  max-height:180px;
}



*




.postdetails.poster-profile a img {
border: 8px solid #4D0000;
-moz-border-radius:8px;
background-color:#4D0000;
}




-RETRAIT : ce CSS pose de nombreux problèmes - { display: none; }



#i_logo {
margin-bottom : 5px;
}






       
       .mon_onglet{
         float: left;
         padding: 2px 10px;
         margin-right: 5px;
         color: #000000;
         background: #C6C6C6;
         border: 1px solid #000000;
         cursor: pointer;
         margin-bottom: -1px;
         list-style: none;
       }
       .mon_onglet:hover{
         background: #561925;
       }        
       .mon_onglet_selected{
         float: left;
         padding: 2px 10px;
         margin-right: 5px;
         color: #000000;
         background: #561925;
         border-top: 1px solid #000000;
         border-right: 1px solid #000000;
         border-left: 1px solid #000000;
         border-bottom: 1px solid #000000;
         cursor: pointer;
         margin-bottom: -1px;
         list-style: none;}          
       .clear{
         clear: both;
       }
       .mon_contenu{
         color: #000000;
         background: #C6C6C6;
         border: 1px solid #561925;
         padding: 10px;
         line-height: normal;
         font-size: 11px;}
       #mes_contenus, #mes_onglets{
         width: 530px;
         margin: auto;}




 

#le_tableau{
       color:#70552C;
       font-size: 12px;
       font-family: Arial;
       background-color: #FFFF91;
       border: 3px solid #DAFF63;
       margin: 3px;
       -moz-border-radius: 12px ;
       -webkit-border-radius: 12px;
       border-radius: 12px;
       -moz-box-shadow: 2px 2px 2px #000;
       -webkit-box-shadow: 2px 2px 2px #000;
       box-shadow: 2px 2px 2px #000;
       -moz- text-shadow: 1px 1px 2px #000;
       -webkit- text-shadow: 1px 1px 2px #000;
       text-shadow: 1px 1px 2px #000;
       }
       
       .text_imag{
       color: #705533;
       text-align: center;
       vertical-align: center;
       font-family: Arial;
       font-size: 30px;
       font-weight: bold;
       }
       
       .style_cellule{
       background-color: #F0E68C;
       border: 3px solid #BEDE56;
       margin: 3px;
       padding: 6px;
       -moz-border-radius: 12px ;
       -webkit-border-radius: 12px;
       border-radius: 12px;
       -moz-box-shadow: 2px 2px 2px #000;
       -webkit-box-shadow: 2px 2px 2px #000;
       box-shadow: 2px 2px 2px #000;
       }
       
       #igauche{
       background-color: #F0E68C;
       background: url("http://i49.servimg.com/u/f49/11/49/46/09/fll10.png") no-repeat bottom left;
       background-color: #F0E68C;
       border: 3px solid #BEDE56;
       padding: 6px;
       -moz-border-radius: 12px ;
       -webkit-border-radius: 12px;
       border-radius: 12px;
       -moz-box-shadow: 2px 2px 2px #000;
       -webkit-box-shadow: 2px 2px 2px #000;
       box-shadow: 2px 2px 2px #000;
       }
       #idroite{
       background-color: #F0E68C;
       background: url("http://i49.servimg.com/u/f49/11/49/46/09/fla111.png") no-repeat bottom right;
       background-color: #F0E68C;
       border: 3px solid #BEDE56;
       padding: 6px;
       -moz-border-radius: 12px ;
       -webkit-border-radius: 12px;
       border-radius: 12px;
       -moz-box-shadow: 2px 2px 2px #000;
       -webkit-box-shadow: 2px 2px 2px #000;
       box-shadow: 2px 2px 2px #000;
       }
       
       .titre_4{
       font-size: 14px;
       color: #70552C;
       border-bottom: 1px dotted #70552C;
       }
       /* Scroller Box */
       
       #scroller_container {
       width: 120px;
       height: 70px;
       overflow: hidden;
       }
       
       #dummy {;# }
       
       #scroller_container {
       overflow: auto;
       }
       
       /* fin Scroller Box */
       
       /* infobulle */
       
       div.info em {
       display:none;
       }
       
       div.info:hover {
       background: none;
       z-index: 999;
       cursor: hand;
       position: relative;
       text-decoration:none;
       border: 0;
       }
       
       div.info:hover em {
       font-style: normal;
       font-size: 10px;
       color:#000 !important;
       padding: 3px;
       display: inline;
       position: absolute;
       top: 62px;
       left: 35px;
       -moz-border-radius: 7px 7px 0px 7px ;
       -webkit-border-radius: 7px 7px 0px 7px ;
       border-radius:7px 7px 0px 7px ;
       -moz-box-shadow: 0px 0px 4px #000;
       -webkit-box-shadow: 0px 0px 4px #000;
       box-shadow: 0px 0px 4px #000;
       background-color: #424242;
       border: 2px solid #BEDE56;
       width:auto;
       }
       
       .titre_info{
       text-align: center;
       font-size: 14px;
       font-style: italic;
       border-bottom: 1px dotted #BEDE56;
       }
       
       /* fin infobulle */

.noms{
font-family: georgia;
font-size: 16px;
text-shadow: #FFFFFF 0px 1px 0px;
text-transform: lowercase;
text-align: center;
 font-style: italic;
}

.cadreavatar {
background-color : #CFD8D4;
border : 1px solid #A0B0AA;
border-radius: 45px;
align: center;
}

.postdetails.poster-profile a img {
border-radius-bottomleft:6px; /*ARRONDI BAS GAUCHE*/
border-radius-bottomright:6px; /*ARRONDI BAS DROITE*/
border-radius-topleft:6px; /*ARRONDI HAUT GAUCHE*/
border-radius-topright:6px; /*ARRONDI HAUT DROITE*/
border-right: 2px solid #A0B0AA;
border-left: 2px solid #A0B0AA;
border-bottom: 2px solid #A0B0AA;
border-top: 2px solid #A0B0AA;
}
input, select {
   color : #808080;
   font: normal 11px Verdana;
   border: #969696;
   border-left-style: solid;
   border-left-width: 1px;
   border-right-style: solid;
   border-right-width: 1px;
   background-color: #DEE4E1;
   -moz-border-radius: 10px 10px 10px 10px;
   }

textarea, select {
   color : #808080;
   font: normal 11px Verdana;
   border: #969696;
   border-left-style: solid;
   border-left-width: 3px;
   border-right-style: solid;
   border-right-width: 3px;
   background-color: #DEE4E1;
   -moz-border-radius: 10px 10px 10px 10px;
   }

ce que j'ai remarquer aussi (et désolé d ne as avoir de capture d'écran pour l'explication) c'est que sur mon ordinateur 17 pouce le fond du forum arrive à la moitié du forum e l'autre motié est complètement blanc :/

Ce que je voudrais donc c'est retrouver un affichage de forum correct:

voilà le forum pour vous faire votre propre idée merci de m'aider à le réglé : http://intersect-in-space.kiffmylife.com/


Dernière édition par Angie Dalton le Mar 30 Juil 2013 - 20:12, édité 1 fois

Angie Dalton
**

Messages : 50
Inscrit(e) le : 30/07/2013

http://intersect-in-space.kiffmylife.com/
Angie Dalton a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Largeur du forum...

Message par bouhafs le Mar 30 Juil 2013 - 17:55

salut,
va sur le panneau = générale = configuration =structure des pages ,
la change le pourcentage et enregistre.

bouhafs
****

Masculin
Messages : 362
Inscrit(e) le : 26/12/2011

http://www.air91-force-algerian.com/
bouhafs a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Largeur du forum...

Message par néco le Mar 30 Juil 2013 - 18:07

salut !

pour ce qui est de ton fond avec une bande blanche ...
je pense que c'est dû au fait que tu à empêcher ton fond de se répéter !
du coup il n'as qu'une seule largeur "fixe"

si tu veux adapter ton fond à toutes les tailles d'écrans , il te faut suivre ce tuto :
http://forum.forumactif.com/t286701-image-de-fond-changeante-selon-la-resolution-du-visiteur
d'ailleurs en  parlant de ce tuto , je te conseil vivement de rajouter une ligne de plus dans le code , et d'avoir en plus des tailles d'image de fond fourni dans la description , un fond de taille 1366 X 768
le code javascript serra donc :
Code:
$(function(){

var bg= "Adresse image (largeur plus grande que 1600px)";

if(screen.width < 801) bg="Adresse image (largeur 800px)";
else if(screen.width < 1025) bg="Adresse image (largeur 1024px)";
else if(screen.width < 1281) bg="Adresse image (largeur 1280px)";
else if(screen.width < 1367) bg="Adresse image (largeur 1366px)";
else if(screen.width < 1601) bg="Adresse image (largeur 1600px)";

document.body.style.backgroundImage="url(\""+bg+"\")";

});

---------------------

pour la largueur totale de ton forum ...
est-tu certaine que cela ne se soit pas produit après que tu ai installer ta bannière ?

en tout cas ta bannière est énoooorme en largeur !
je me trompe peut-être mais je crois que c'est cette largueur de bannière qui déforme ton forum en largueur (puisque cette largueur est "fixe" ^^ )

de manière général ... pour une bannière "normal" je préconiserais de ne pas dépasser les 1024 pixel de long !

si tu veux enlever ta bannière "normale" pour faire une "bannière de fond" ...
jette un œil à cet autre tuto , on sais jamais , c'est peut être ce que tu cherches ...

http://forum.forumactif.com/t239492-banniere-en-image-de-fond

en espérant avoir aidé !

bizzz

néco
*****

Féminin
Messages : 782
Inscrit(e) le : 13/02/2013

http://pephenix.forumactif.org/
néco a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Largeur du forum...

Message par bouhafs le Mar 30 Juil 2013 - 19:36

exacte néco bien vue ,
l'agrandissement du Forum viens bien de la bannière,
pour l'avoir essayer ,
Cdt

bouhafs
****

Masculin
Messages : 362
Inscrit(e) le : 26/12/2011

http://www.air91-force-algerian.com/
bouhafs a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Largeur du forum...

Message par Angie Dalton le Mar 30 Juil 2013 - 19:53

o_o ha n effet quand je l'enlève...bon d'accord je verrais cela avc celle qui ma fait le design

quand au code ou dois-je le mettre sur la feuille Css? est-ce que je peut le mettre à la suite du code que j'ai déjà au dois-je le mettre à un endroit précis

Angie Dalton
**

Messages : 50
Inscrit(e) le : 30/07/2013

http://intersect-in-space.kiffmylife.com/
Angie Dalton a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Largeur du forum...

Message par néco le Mar 30 Juil 2013 - 20:03

@Angie Dalton a écrit:o_o ha n effet quand je l'enlève...bon d'accord je verrais cela avc celle qui ma fait le design

quand au code ou dois-je le mettre sur la feuille Css? est-ce que je peut le mettre à la suite du code que j'ai déjà au dois-je le mettre à un endroit précis

pour ce qui est du code pour les fonds d'écrans adapter à toute les tailles d'écran ...
clique sur le lien du tuto que je t'ai mis plus haut ...

c'est bien expliqué tu verra !

il y a une partie à mettre dans le java script (ce que j'ai mis plus haut)
et une autre partie à mettre dans le css , tu verra ! Wink

mais commence par fabriquer tes fonds aux dimensions demandé dans le topic , plus la dimension en plus que je t'ai indiqué plus haut ...
n'essaie pas de les redimentionner en passant par un hébergueur qui redimentionne , ça ne marche pas Wink
fait le avec ton paint tout simple ... en décochant "garder les proportions" , et en indiquant le nombre de pixels souhaités en hauteur et largueur !

une fois que tu as toute tes images (donne leur des noms différent hein ! ^^) tu n'as plus qu'a suivre le tuto ! Wink

------------

et "oui" , la partie à mettre dans le css , tu peux le mettre à la suite de ce que tu as déjà sans problème ...

saute juste une ou deux ligne , pour bien les différencier des précédent ! Wink


bizzz

néco
*****

Féminin
Messages : 782
Inscrit(e) le : 13/02/2013

http://pephenix.forumactif.org/
néco a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Largeur du forum...

Message par Angie Dalton le Mar 30 Juil 2013 - 20:10

merci infiniment c'est génial^^

Angie Dalton
**

Messages : 50
Inscrit(e) le : 30/07/2013

http://intersect-in-space.kiffmylife.com/
Angie Dalton a été remercié(e) par l'auteur de ce sujet.

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


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