Le design est tout simplement magnifique, mais c'est sans vouloir être méchant que je viens en disant que la bannière dépasse les standarts de bases les plus reconnus, soit du 1024/760. On perd à peine un morceau, ce n'est donc en rien dramatique, mais simplement moins adapté sur l'idées de largeur maximale. Mon problème vient particulièrement de l'optimisation Firefox qui empêche tout autre browser, aussi récent soit-t-il. Safari ne supporte tout simplement pas le widget et ne l'affiche pas, il y a tellement peu de monde sur safari, ce n'est donc pas grave, la même chose va sur internet explorer. Mais quand Google Chrome et Opera refusent de montrer le modèle, ça devient problématique. (je harcelle Mört avec ça, tu sais que je t'aime Mört).
Dans l'ordre en excluant IE qui ne supporte PAS le css3:
- Mozilla Firefox
- Google Chrome
- Opera
- Apple Safari
Je sais qu'on peut spécifier qu'on optimise pour Mozilla Firefox, mais un forum ne devrait pas forcer un utilisateur à changer de navigateur de base. Les utilisateurs de Internet Explorer (qui perdent l'Option css3 sans que ça fasse très mal) parce que leur famille ou leur ordinateur ne leur en donne pas le choix perdront l'accès plaisant au forum.
Voici le résultat chrome/Opera/Safari/Explorer
Le tout se rapporte à une solution simple. Du moins je crois à moins que le bug soit plus complexe et profondément encré. Il faudrait un div avec un id du genre global pour encadrer tout le message de page d'accueil et établir la taille maximale à l'espace que vous avez décidé de consacrer à la largeur du forum (ou largeur de l'image réactive).
CSS
- Code:
-
#global{
width:885px;
}
HTML
- Code:
-
<div id="global">
<div name="pageAccueil">
<!--Ici vous avez tout le contenu de la page d'accueil que vous gardez inchangé-->
</div>
</div>
Cette solution, quoi que valide peut être dis-fonctionnelle si le forum s'adapte en pourcentage à la largeur du forum par rapport à la résolution pixel de l'écran. Comme vous avez donc pu le voir dans la miniature le bloc du bas avec la navigation qui fait apparaître diverses informations se place de manière horizontale. J'attribue le problème à un float. La solution pour cette partie du problème consiste à annuler le float et libérer les deux côtés d'un div pour faire en sorte que le menu navigable se retrouve en bas.
CSS
- Code:
-
#global{
width:885px;
}
.clear{
clear:both;
}
HTML
- Code:
-
<div id="global">
<div name="imageReactive">
<!--Ici il y a l'image cool qui fait truc funkys-->
</div>
<div class="clear"></div>
<div name="boutNavigable">
<!--Ici il y a la bar de navigation avec les menus qui apparaissent en dessous-->
</div>
</div>