Support de smfgratuit

Réservé aux forums smf officiel => Archives des demandes d'aides => Discussion démarrée par: Hotcmel le 17 Janvier 2008 à 16:35:30



Titre: modifier la largeur du forum
Posté par: Hotcmel le 17 Janvier 2008 à 16:35:30
Bonjour,

alors voila je souhaiterai modifier la largeur du forum j ai trouver ca

http://support.smfgratuit.org/index.php?topic=660.0

mais j aurais voulu savoir comment fait on ??

a la base j ai ca

Citation
* The main body of the entire forum. */
body
{
   background-color: #02020d;
   margin: 0px;
   padding: 12px 30px 4px 30px;

et si je compren bien il faut changer ca et mettre

Citation
* The main body of the entire forum. */
body
{
   background-color: #02020d;
   margin: 800px;
   padding: 12px 30px 4px 30px;

c est ca ?

merci  ;)


Titre: modifier la largeur du forum
Posté par: Marc le 17 Janvier 2008 à 18:18:22
Bonjour,

Le margin défini une marge un espace entre le bord de la fenetre de ton navigateur et le contenu de ta page.
Il est possible de modifier les valeurs du padding. Mais je pense que à mon avis il y a une div dans ton theme qui est à modifier plutot que les valeurs mise dans la feuille de style.


Titre: modifier la largeur du forum
Posté par: Hotcmel le 17 Janvier 2008 à 19:18:04
tu peut me faire voir comment on fait car je n y connais pas trop bien en code  :-\

merci


Titre: modifier la largeur du forum
Posté par: Marc le 17 Janvier 2008 à 22:09:49
il faut chercher dans le fichier index.template.php la balise <body> qui est le debut du contenu de ta page web et voir ensuite ce qui suit pour la mise en forme de ton forum.


Titre: modifier la largeur du forum
Posté par: Hotcmel le 18 Janvier 2008 à 15:29:43
j ai ca au debut

Code:
	echo '
<div class="tborder" ', $context['browser']['needs_size_fix'] && !$context['browser']['is_ie6'] ? ' style="width: 100%;"' : '', '>
<table width="100%" cellpadding="0" cellspacing="0" border="0">
<tr>
<td class="catbg" height="32">';

if (empty($settings['header_logo_url']))
echo '
<span style="font-family: Verdana, sans-serif; font-size: 140%; ">', $context['forum_name'], '</span>';
else
echo '
<img src="', $settings['header_logo_url'], '" style="margin: 4px;" alt="', $context['forum_name'], '" />';

echo '
</td>
<td align="right" class="catbg">
<img src="', $settings['images_url'], '/smflogo.gif" style="margin: 2px;" alt="" />
</td>
</tr>
</table>';


Titre: modifier la largeur du forum
Posté par: Marc le 18 Janvier 2008 à 15:40:11
C'est bien ce que je disais, tu as une balise div qui subis une classe tborder dans le fichier de style, reste à voir si ce style réduit la page (voir le fichier style.css).
Citation
<div class="tborder"


Titre: modifier la largeur du forum
Posté par: lance_yien le 20 Janvier 2008 à 11:56:14
bonjour à tous
c'est pus facile et plus pratique par le fichier "style.CSS" (qui se trouve dans le thème de ton forum),
1- tu le télécharges et l'édites de la façon suivante:
paragraphe original:
Citation
body
{
   background-color: #E5E5E8;
   margin: 0px;
                padding: 12px 30px 4px 30px;
}

final:
Citation
body
{
   background-color: #E5E5E8;
   margin: auto;
   width: 90%;
                padding: 12px 30px 4px 30px;
}

2- tu retournes sur ton ftp et tu renommes le fichier original en style1.CSS par exemple (pour le "on sait jamais:))
et tu envoies ton nouveau fichier,
relance la page de ton forum et constate

>> "width" (=largeur) est indiquée ici en % de ton écran (tu mets donc la valeur que tu veux) mais il peut s'exprimer en pixels comme ceci "width: 600px;" (moins flexible comme paramètre)
tu peu voir le mien en 90% ici: http://lanceyien-info.com/Forum/
et tu peux agir sur beaucoup de chose avec le CSS
bon courage ;)


Titre: modifier la largeur du forum
Posté par: Marc le 20 Janvier 2008 à 12:01:32
J'avais pas fait attention mais visiblement le style est forcé dans la balise div
Citation
<div class="tborder" ', $context['browser']['needs_size_fix'] && !$context['browser']['is_ie6'] ? ' style="width: 100%;"' : '', '>
Ici on test le navigateur mais on peut le forcer pour tout le monde en remplaçant par:
Citation
<div class="tborder" style="width: 100%;">
A tester avec les différents navigateurs.....


Titre: modifier la largeur du forum
Posté par: lance_yien le 20 Janvier 2008 à 12:46:24
ça ne fait rien il va prendre les 100% de ce que le CSS lui donne
j'ai mis longtemps pour comprendre l'utilité et la fonction de ce "tborder" en préparant ma page d'accueil: c'est l'espace entre les blocs (sections du forum) de la page


Titre: modifier la largeur du forum
Posté par: Marc le 20 Janvier 2008 à 13:18:34
Après il suffit de régler les 100% bien evidemment  :P


Titre: modifier la largeur du forum
Posté par: Marc le 20 Janvier 2008 à 13:20:21
Après il suffit de régler les 100% bien evidemment  :P
cela dépend aussi du theme, ici la largeur de ce tborder defini uniquement l'entete du forum  :D


Titre: modifier la largeur du forum
Posté par: Hotcmel le 21 Janvier 2008 à 15:55:24
merci beaucoup je vais tester ca merci  ;)


Titre: modifier la largeur du forum
Posté par: Hotcmel le 20 Février 2008 à 17:35:06
bonjour à tous
c'est pus facile et plus pratique par le fichier "style.CSS" (qui se trouve dans le thème de ton forum),
1- tu le télécharges et l'édites de la façon suivante:
paragraphe original:
final:
2- tu retournes sur ton ftp et tu renommes le fichier original en style1.CSS par exemple (pour le "on sait jamais:))
et tu envoies ton nouveau fichier,
relance la page de ton forum et constate

>> "width" (=largeur) est indiquée ici en % de ton écran (tu mets donc la valeur que tu veux) mais il peut s'exprimer en pixels comme ceci "width: 600px;" (moins flexible comme paramètre)
tu peu voir le mien en 90% ici: http://lanceyien-info.com/Forum/
et tu peux agir sur beaucoup de chose avec le CSS
bon courage ;)

j ai essayé mais cela ne fonctionne pas j ai un fond blanc au lieu du bleu et en largueur cela ne bouge pas d un poil  :-\


Titre: modifier la largeur du forum
Posté par: Marc le 20 Février 2008 à 18:21:52
Bonjour,

Elle contient quoi la class qui gère ton afifchage?


Titre: modifier la largeur du forum
Posté par: domipedro le 21 Février 2008 à 13:20:42
salut
si c'est pour réduire légèrement, tu peux jouer avec le "padding"
ton code est:
Code:
* The main body of the entire forum. */
body
{
   background-color: #02020d;
   margin: 0px;
   padding: 12px 30px 4px 30px;

Ce qui veut dire que le "BODY" (corps du forum) a une distance , du bord de la fenêtre, 12pixel du haut, 30px du bord droite, 4pixel du bas et 30px du bord gauche.
Donc tu peux jouer avec les padding gauche et droite.

Pous rappel, le margin est la marge externe et le padding celle interne, quant on a un valeur du genre:
Code:
body
{
padding: Vpx Vpx Vpx Vpx;
}
Les valeur sont dans l'ordre:
Code:
body
{
padding: Valeur du haut Valeur de droite Valeur du bas Valeur de gauche;
}

Quant tu met deux valeur identique de chaque cote (ex gauche et droite), tu peut l'ecrire comme ca:
Code:
body
{
padding: 12px 30px 4px;
}

Donc a savoir:
  • si une seule valeur, elle s'applique aux quatre cotés
  • si deux valeurs, la première s'applique à "haut" et "bas", et la deuxième à "droite" et "gauche"
  • si trois valeurs, la première s'applique à "haut", la seconde à "droite" et "gauche" et enfin la troisième à "bas"
  • si quatre valeurs, la première s'applique à "haut", la seconde à "droite", la troisième à "bas" et la dernière à "gauche"


Titre: modifier la largeur du forum
Posté par: Marc le 21 Février 2008 à 13:49:25
Et si on remplace le margin par un width=800px, cela ne fonctionne pas?


Titre: modifier la largeur du forum
Posté par: domipedro le 21 Février 2008 à 14:53:56
ou la non je te fais vite fais un croquis:

(http://img519.imageshack.us/img519/3723/marginpaddingpe5.gif)

Le trait noir représente ton margin ( dons notre cas, le body, qui lui rempli l'écran de ton pc, je parle pour le thème par défaut, car chaque thème ce comporte différemment)
Le trait rouge représente lui le padding ( distance entre la marge et le contenu)

Dans ton cas, tu dit un margin de 800px, traduction, tu demande 800px entre l'ecran et le margin, et surtout, 800px en haut,gauche,droite et bas, imagine un peu( même moi avec ma résolution de 1680 j'aurais une belle surprise, il ne me reste plus que 80px pour afficher tout le contenu du forum, alors sur une résolution de 800px??????)
Dans mon cas, je que j'ai dit , c'est simplement de donner une valeur au padding, ce qui veut dire, que tu demande une marge plus importante entre le trait noir et le trait rouge, ce qui est plus logique, ne serais ce que pour les cas, ou l'on met une image en background pour le body.

A la limite tu aurais pu donner une valeur de 50px au margin, mais dans le cas d'un background-image, elle ne collera pas aux bord de l'écran de l'internaute.

J'espère de ne pas avoir été un peu trop compliquer  :P


Titre: modifier la largeur du forum
Posté par: Marc le 21 Février 2008 à 15:22:06
très très bien ce croquis domipedro pour expliquer le margin....

Moi je faisais allusion à la solution donnée précédemment par lance_yien:
Citation
body
{
   background-color: #E5E5E8;
   width: 90%;
}
sachant que le width en % peut être aussi fixé en pixel (px), logiquement cela règle la largeur pour tout le forum à condition de ne pas avoir une balise qui interfère avec celle ci.


Titre: modifier la largeur du forum
Posté par: domipedro le 21 Février 2008 à 15:25:25
oui tout a fait, mais la ce n'est plus une valeur de margin.
le code serais plus:
{
   background-color: #E5E5E8;
   width: 90%;
   margin: auto;
}
car sinon ton forum sera coller a gauche.


Titre: modifier la largeur du forum
Posté par: Marc le 21 Février 2008 à 16:11:53
Merci de la correction domipedro  ;)


Titre: modifier la largeur du forum
Posté par: lance_yien le 21 Février 2008 à 20:44:43
bonsoir à tous,

je pense que tout a été dit par domipedro :)

juste un petit plus sur ces "margin":
on met un "margin: auto;" pour que la page se centre automatiquement.
un margin-top (-bottom, -left, -right) pour qu'elle ne colle pas en haut (en bas, à gauche, à droite)
voici le mien (thème par défaut):
Citation
body
{
   margin: auto;  /* très important pour le centrage*/
   margin-top: 20px;
    margin-bottom: 20px;
  padding: 5px 5px 5px 5px;
   width: 90%;
   border: 5px solid #aa0000;
   font-family: Arial, "Arial Black", "Times New Roman", verdana, Times, serif;
   background-image: url("http://lanceyien-info.com/...");
}

si ça peut t'apporter qq chose

@ mkc:
perso je préfère les dimensions en XX% c'est plus souple et s'adapte à toutes les résolutions

a+ ;)


Titre: modifier la largeur du forum
Posté par: Marc le 21 Février 2008 à 22:44:39
@lance_yien: Il me semble qu'il a une incompatibilité de navigateur avec le % ce qui n'est pas le cas avec le px, peut être que depuis cela a changé....  ;D

Ps: merci pour ce partage  ;)


Titre: modifier la largeur du forum
Posté par: Hotcmel le 26 Février 2008 à 17:29:42
merci a tous pour vos reponses je vais faire un test  :-*