Correction CSS du forum (css corriger joint)

[Misterious]

Ce matin j’ai eu envie de donner un coup de main à cette communauté que j’aime de plus en plus

Depuis quelques temps j’ai remarqué que le CSS (la mise en page) du forum était toutes casser, étant conscient que les dev avez d’autre chose plus importante à faire que de corriger ces petits défaut je me suis permis de le faire en local pour la page d’accueil du forum.

 

Je joins si dessous 2 screen avant/après et les corrections à effectuer.

 

Espérant que ça vous sera utile !

 

Si vous le souhaitez je peux faire les autres pages.

Cordialement

 

 

Avant:

 

Aprés:

 

 

Voici les corrections:

 

Correction CSS minefield

Fichier:
Style.php?id=3 ligne 959
ul.topiclist dd {
display: block;
float: left;
border-left: 1px solid #CDCDCD;
margin: 0;
padding: 10px 8px 0px;
height: 45px;
background: #ffffff url("http://media.minefield.fr/forum/styles/minefield/theme/images/cell-bg.png") repeat-x top center;
margin-left: 1px;
font-size: 10px;
}

Modifier 	padding: 24px 8px 0px;   => 	padding: 10px 8px 0px;
Comme ca les dates longue ne dépasserons plus!

Style.php?id=3 ligne 937
ul.topiclist dl.icon {
background-position: 840px 12px; 
}

Remplacer background-position: 840px 12px;  par rien! le background ce mets en bonne position d'office. la c'est bugué


style.php?id=3 ligne 1097

dl.icon dt {
padding-left: 37px;
padding-right: 70px;
background-repeat: no-repeat;
background-position: 5px 95%;
font-weight: normal;
padding-top: 16px;
padding-bottom: 16px;
height: 50px;
color: #888;
width: 918px;
}
Enlever background-repeat: no-repeat; et background-position: 5px 95%; inutile il n'y as pas de background.
Enlever padding-right: 70px; dans tous les cas le contenu ne dépassera pas
Changer padding-left: 37px par padding-left: 44px; c'est plus zoulie 
Enlever padding-bottom: 16px; il ne ser a rien
On rajoute une taille en largeur.

Ajouter padding-top: 2px; Le contenu sera mieu alligner on vas recommencer a voir la liste des modérateurs

style?php?id=3 ligne 1000
.forum-image {
float: left;
padding-top: 5px;
padding-bottom: 10px;
margin-right: 10px;
}

On remplace toutes la classe.
.forum-image {
float: left;
display: block;
height: 48px;
width: 45px;
text-align: center;
line-height: 48px; 
}

Il faut crée une classe:
.forum-image img {
vertical-align: middle;
}


style.php?id=3 ligne 1090
li.header dl.icon dt {
padding: 0;
padding-left: 30px;
padding-right: 30px;
height: 47px;
line-height: 53px;
font-weight: normal;
width: 918px;
}

On rajoute une attribut width pour tous recaler corectement
On change a valeur de height
On change l'attribut line-height pour recaler le message de bien venu


style.php?id=3 ligne 1061
li.header dt, li.header dd {
line-height: 64px;
margin: 0;
color: #8BAB8D;
font-size: 32px;
font-weight: bold;
font-family: Economica, Arial, Helvetica, sans-serif;
text-transform: uppercase;
}

On change la valeur de line-height pour recaler le tous

 

[Kehnte]

Je crois que dok bosse dessus encore en ce moment mais je ne peux que féliciter une suggestion avec une solution concrète sur un plateau d'argent !

[Thorgrin]

Hello !

 

Vu que dok est entrain de voir tout cela, je lock ce topic.