Le theme FSB2 [rc5] :: Fire Soft Board

Korko

Equipe des MODS

Age : 22 ans
Messages : 2688
Inscrit : 06 Octobre 2004

08 Novembre 2007, 6:55

Reprise du dernier message

Autant demander à IE de respecter les standards c'est un reve irréalisable

Autant voire que FireFox et Opera n'arrivent pas à se mettre daccord sur la css sa me déçoit profondément.

Apres le débat Div/Tableau est tres tres tres connu et répandu. Je dirais que la faute n'est pas à jeter contre les développeurs comme nous mais plus contre les développeurs de WebBrowsers (IE/FF/Opera). On ne doit pas arraché le fleur du pisenli, on doit le prendre à la racine.

Dieu vous aime. Offre soumise à conditions
Je suis une Brute

Spark

Volcan

Messages : 1999
Inscrit : 24 Juin 2006

08 Novembre 2007, 10:23

La racine n'est pas à notre porté, alors il faut faire avec.

Mon site de jeux en réseau Hamachi :
http://www.jeux-reseau.fr
Le forum : http://forum.jeux-reseau.fr

http://img100.imageshack.us/img100/4097/voegelpc3jk2jx2kw4xg6.gif

nerevare

Volcan

Age : 32 ans
Messages : 1858
Inscrit : 10 Juillet 2005

08 Novembre 2007, 23:09

Citation (Genova, 08 Novembre 2007, 1:11)

Ne m'accuses pas de monter au crénaux si tu y montes toi même en pole position ^^

Je n'ai jamais dit que les minorités n'étaient pas rentable, j'ai simplement dit que si la minorité pénalise la majorité, alors tant pis pour la minorité. Je n'ai jamais soutenu que le thème devait être totalement en tableau et je ferai un juste milieu, je coupais simplement cours aux arguments comme quoi un forum 100% sans tableau c'était bien.

garde les tableaux dans ce cas c'est ce qui me semble le plus accessible , les div franchement BOOOOFF moi je n'aime pas du tous ca restrain franchement les possibilliter qu'on a pas avec les tableau
meme si c'est asser baradarre de ce taper des code de ce style

table tr td /td td table tr td /td td table /td /tr /table /td /tr /table

vous n'arriverez JAMAIS a des resuletas aussi tordu que les tableau
de plus si je regarde mon entourage les ecolier aprrenne bien souvent les base du html sans passer par le css et autres

mon point de vues n'est peut etre pas corecte mais je soutien fermement que les tableau on encore de tres tres longue année devant eux et encore une fois son la solution adapter a tous les novice

http://www.dagonfield.be/bandeau_dgf2.jpg

N°1 des skins Fire Soft Board
http://www.dagonfield.be http://www.mon-portfolio.be

Grummfy

Equipe des MODS

Age : 23 ans
Messages : 5469
Inscrit : 16 Septembre 2004

08 Novembre 2007, 23:24

les tableau sont a bannir, cependant l'utilisation massive de ie empêche cela ...

les div sont bien plus modulable qu'un tableau...

de toute manière c'est celui qui fait le thème qui choisi, les autres faites vous même le thème ....

"La gravité est le bonheur des imbéciles" Charles de Montesquieu > "T'as raison, L'apesanteur c'est plus rigolo" Hébus de Phalompe (Troll de Troy)

http://www.grummfy.com/download/crea/smileys/fsb2.gif

Mods fsb1 - Mods fsb2 - Mon forum - Grummfy's project

Talus

Volcan

Age : 20 ans
Messages : 1552
Inscrit : 28 Septembre 2006

08 Novembre 2007, 23:25

Citation (grummfy, 08 Novembre 2007, 23:24)

les tableau sont a bannir, cependant l'utilisation massive de ie empêche cela ...

les div sont bien plus modulable qu'un tableau...

de toute manière c'est celui qui fait le thème qui choisi, les autres faites vous même le thème ....

Plussun avec le tout...

Talus' Works - Talus' LaBlog

http://www.siteduzero.com/uploads/fr/files/144001_145000/144884.png

Genova

Chef du projet FSB

Age : 22 ans
Messages : 14520
Inscrit : 16 Septembre 2004

Message édité 1 fois, dernière édition par Genova, 08 Novembre 2007, 23:37

08 Novembre 2007, 23:36

Citation (grummfy, 08 Novembre 2007, 23:24)

les div sont bien plus modulable qu'un tableau...

Fait moi un équivalent exacte de

HTML (Sélectionner le code)

<table>
   <tr>
      <td style="width: 33%; background-color: #f3f3f3">Colone 1</td>
      <td style="width: 33%; background-color: #f3f3f3">Colone 2</td>
      <td style="width: 33%; background-color: #f3f3f3">Colone 3</td>
   </tr>
</table>

juste pour voir ce que ça donne en div, stp.

Cause Im as free as a bird now, And this bird you can not change. - Freebird - Lynyrd Skynyrd
There's someone in my head but it's not me. - Brain damage - Pink Floyd
I said baby, you know Im gonna leave you. - Babe I'm gonna leave you - Led Zeppelin
Father ? yes son, I want to kill you - The end - The Doors

Ejis

Flammeche

Age : 21 ans
Messages : 73
Inscrit : 19 Octobre 2005

09 Novembre 2007, 0:12

Ne tombez pas dans le zéro tableau non-plus !
Pour lister les sujets, les forums, oui, c'est sémantique !
Par contre, pour les messages, on va dire que c'est tolérable, mais le pied, une div s'avérera plus légère et plus accessible. Et je le répète, en haut, des listes sont tout-à-fait envisageables !

Le clavier et la partition.Info

http://webstatus.kd2.org/userbar.php/jid/es.eroonw..fvwr/image.png

Ejis

Spark

Volcan

Messages : 1999
Inscrit : 24 Juin 2006

09 Novembre 2007, 0:12

Tu essais de faire quoi là ? Un truc qui prend 100% de la largeur ? Parce que ça marche pas ^^

Mon site de jeux en réseau Hamachi :
http://www.jeux-reseau.fr
Le forum : http://forum.jeux-reseau.fr

Grummfy

Equipe des MODS

Age : 23 ans
Messages : 5469
Inscrit : 16 Septembre 2004

09 Novembre 2007, 0:16

il existe plusieurs technique,
en voici une :

HTML (Sélectionner le code)

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
  <meta content="text/html; charset=ISO-8859-1"
 http-equiv="content-type">
  <title></title>
  <style>
.cellule
{
width: 33%;
background-color: #c3c3c3;
}
.tableau .cellule
{
display: table-cell;
border: 1px white solid;/*simule l'entre cellule*/
padding: 1px;
}
  </style>
</head>
<body>
<table>
  <tbody>
    <tr>
      <td class="cellule">Colone 1</td>
      <td class="cellule">Colone 2</td>
      <td class="cellule">Colone 3</td>
    </tr>
  </tbody>
</table>
<br>
<hr>
<br>
<div class="tableau">
<div class="cellule">Colone 1</div>
<div class="cellule">Colone 2</div>
<div class="cellule">Colone 3</div>
</div>
</body>
</html>

bon c'est pas très classe, mais à faire rapidement ....

sinon il ne faut pas oublier que la première soruce d'erreur en affichage cest les préférence des différents navigateurs (certaine mettent un espace de 3 d'autre de 2, etc...

on a pas dit pas de tableau du tout mais disons que il y a un certain nombre de chose que l'on peu oublié ....

mais comme je l'ai dit il ne sert à rien d'insister, si on est pas content faisons un autre thème..

"La gravité est le bonheur des imbéciles" Charles de Montesquieu > "T'as raison, L'apesanteur c'est plus rigolo" Hébus de Phalompe (Troll de Troy)

Mods fsb1 - Mods fsb2 - Mon forum - Grummfy's project

Genova

Chef du projet FSB

Age : 22 ans
Messages : 14520
Inscrit : 16 Septembre 2004

09 Novembre 2007, 1:24

Ta solution n'est pas recevable pour deux raisons :
1) D'une part table-cell est une propriété qui revient en gros à faire un tableau (d'où son nom ...), je vois pas la différence entre un tableau et un div avec table-cell personellement ...
2) La seconde raison est plus importante : table-cell n'est pas supporté par IE.

Je ne vois donc pas l'intéret de mettre des div pour remplacer les tableaux, en utilisant une propriété qui agira comme si c'était un tableau, propriété qui ne marchera pas sur le navigateur le plus utilisé ...

Tu ne m'as toujours pas prouvé que les div étaient plus modulables que les tableaux là.

Cause Im as free as a bird now, And this bird you can not change. - Freebird - Lynyrd Skynyrd
There's someone in my head but it's not me. - Brain damage - Pink Floyd
I said baby, you know Im gonna leave you. - Babe I'm gonna leave you - Led Zeppelin
Father ? yes son, I want to kill you - The end - The Doors

B.Moncef

Equipe de support

Age : 18 ans
Messages : 1926
Inscrit : 10 Septembre 2005

09 Novembre 2007, 1:48

L'exemple que tu donnes Géno est assez simple, c'est un tableau avec trois cellules, pourquoi le remplacer ? et on peut pas vraiment prouver que les div sont plus accessibles ici.

Mais sur un gros design, avec une multitude de cellules, lignes et tableaux imbriqués comme la ligne de code de nere plus haut, c'est beaucoup plus accessible quand on remplace par des div.

Certes les div ne permettront pas de faire des trucs aussi tordus que les thèmes de nere par exemple, et surtout ne donneront pas le même rendu sur tous les navigateurs, mais les tableaux ne sont pas fais pour le design.

Mais je suis d'accord avec vous quand vous dites que le design d'un forum ne peut pas être fait sans tableau, vu que la plupart des données sont tabulaires (messages, forums, sujets, etc.)

Genova

Chef du projet FSB

Age : 22 ans
Messages : 14520
Inscrit : 16 Septembre 2004

09 Novembre 2007, 2:08

Je suis d'accord avec toi, je coupe simplement cours à l'argument "les div sont plus simple à utiliser que les tableaux".

Cause Im as free as a bird now, And this bird you can not change. - Freebird - Lynyrd Skynyrd
There's someone in my head but it's not me. - Brain damage - Pink Floyd
I said baby, you know Im gonna leave you. - Babe I'm gonna leave you - Led Zeppelin
Father ? yes son, I want to kill you - The end - The Doors

Tekarihoken

Brasier

Messages : 947
Inscrit : 11 Juin 2005

09 Novembre 2007, 7:45

Bah pour ma part je sais que j'ai toujours trouvé les forum PunBB assez austère et ne me donnaient pas envie d'être utilisé.

De plus il ne faut pas oublier que les règle du W3C restent que des recommandation et non des norme comme tout le monde semble le penser.

La faute du débat div vs tableau est pas nouvelle et est issu du conflit entre navigateur d'une part mais aussi due au W3C qui a changé sa recommandation du jour au lendemain en disant "codez plus en tableau mais en div" or les gens ne changent pas leur facon de faire aussi rapidement il y a une très grosse inertie, cette inertie explique partiellement aussi les divergence de point de vue entre les navigateur sur l'implémentation de ces div c'est une spirale sans fin.

Pour l'accessibilité je suis un peu du même point de vue que Genova, il faut que FSB reste adapté au plus grand nombre par conséquent c'est bien d'avoir un theme tout en div etc... mais si personne n'utilise FSB a cause de ca car le systeme de template est incompréhensible et rebute tous les graphiste c'est absurde.

De plus rien ne dit que le theme de base doit absolument servir de base aux autre theme, rien n'empeche la communauté de créer une série de theme-kit vierge qui serviront de base aux graphiste pour monter de nouveau thème (avec certain en tableau d'autre en div par expemple)

http://www.antcrusade.com/images/ac_banner_486x60.gif

Grummfy

Equipe des MODS

Age : 23 ans
Messages : 5469
Inscrit : 16 Septembre 2004

09 Novembre 2007, 13:49

Citation (Genova, 09 Novembre 2007, 1:24)

Ta solution n'est pas recevable pour deux raisons :
1) D'une part table-cell est une propriété qui revient en gros à faire un tableau (d'où son nom ...), je vois pas la différence entre un tableau et un div avec table-cell personellement ...
2) La seconde raison est plus importante : table-cell n'est pas supporté par IE.

Je ne vois donc pas l'intéret de mettre des div pour remplacer les tableaux, en utilisant une propriété qui agira comme si c'était un tableau, propriété qui ne marchera pas sur le navigateur le plus utilisé ...

Tu ne m'as toujours pas prouvé que les div étaient plus modulables que les tableaux là.

Citation (Genova, 09 Novembre 2007, 2:08)

Je suis d'accord avec toi, je coupe simplement cours à l'argument "les div sont plus simple à utiliser que les tableaux".

simple j'ai jamais dit, j'ai dit plus modulable! c'est totalement différent...

plus modulable dans le sens où tu peux changer totalement la forme ... changer l'ordre, mettre en block ou en ligne, etc.... bref tu peux appliqué plus de propriété

il est logique d'utiliser une table-cel c'est ce qui correspond a ce qu'on veux ..., tout comme utiliser des display: inline avec des li est utile ... et clair dans ce que l'on veux.
certes c'est pas utilisable sous ie, mais comme je l'ai dit, on ne pourra pas utiliser les div sans table tant qu'on regarde ie!

et comme je l'ait dit, celui à qui cela ne convient pas à qu'a faire son thème...

ce que j'ai dit c'est qu'il faut banir els tableau, mais pas que c'était faisable pour tous...

maitenant, qu'on arrête de palabreer et de parler pour rien et qu'on finisse le thème et publie cette finale!

"La gravité est le bonheur des imbéciles" Charles de Montesquieu > "T'as raison, L'apesanteur c'est plus rigolo" Hébus de Phalompe (Troll de Troy)

Mods fsb1 - Mods fsb2 - Mon forum - Grummfy's project

Spark

Volcan

Messages : 1999
Inscrit : 24 Juin 2006

Message édité 11 fois, dernière édition par Spark, 10 Novembre 2007, 14:38

09 Novembre 2007, 16:43

Je sais que c'est inutile puisse que le thème va changer mais bon.

Voilà une total réorganisation de la bannière actuelle, j'ai essayé d'être le plus fidèle possible. Ca ma pris environ 2 heures. C'est valide et ça s'affiche parfaitement bien sur IE6, Firefox et Opera. Je n'ai pas pu tester sur d'autre navigateur. Fonctionne aussi sur safari version Windows.

Modification visible à cette adresse :

Code (Sélectionner le code)

http://spark-web.info/fsb2

Pour les changements,

Remplacé l'intégralité du fichier ~/tpl/WhiteSummer/files/header.html

Par :

HTML (Sélectionner le code)

<include name="functions.html" />
<variable name="VAR_HEADER_EXISTS" value="1" />
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
	<title>{TAG_TITLE}</title>
	
	<meta http-equiv="Content-Type" content="text/html; charset={LG_CHARSET}" />
	<meta http-equiv="Content-Style-Type" content="text/css" />
	<link type="text/css" rel="stylesheet" href="{ROOT}tpl/{USER_TPL}/main.css" />
	<link type="text/nonsense" rel="stylesheet" href="{ROOT}tpl/{USER_TPL}/opera.css" />
	<!--[if lte IE 6]><link type="text/css" rel="stylesheet" href="{ROOT}tpl/{USER_TPL}/ie6.css" /><![endif]-->
	<!--[if IE 7]><link type="text/css" rel="stylesheet" href="{ROOT}tpl/{USER_TPL}/ie7.css" /><![endif]-->
	<link rel="shortcut icon" href="{ROOT}tpl/{USER_TPL}/img/favicon.ico" />
	<block name="meta">
		<{meta.NAME} <block name="meta.attr">{meta.attr.KEY}="{meta.attr.VALUE}" </block>/>
	</block>
	<call name="javascript" arg1="mootools.js" />
	<call name="javascript" arg1="common.js" />
	<script type="text/javascript">
	<!--
	var FSB_ROOT = '{ROOT}';
	var FSB_SID = '{SID}';
	var FSB_PHPEXT = '{PHPEXT}';
	-->
	</script>

	<if content="$HAVE_NEW_MP">
		<call name="javascript" arg1="popup.js" />
		<script type="text/javascript">
		<!--
		popup_open(300, 150, '{LG_INFORMATION}', '{POPUP_CONTENT}\<br \/\>\<a href="{U_REDIRECT_INBOX}">{LG_MP_NEW_POPUP_CLICK}\<\/a\>\<br \/\>\<br \/\>\<a href="javascript:popup_close()"\>{LG_MP_POPUP_CLOSE}\<\/a\>');
		//-->
		</script>
	</if>

	<!--# Code lancé dans une page utilisant l'affichage à onglet #-->
	<if content="$MENU_HEADER_TITLE">
		<style type="text/css">
		<!--
		.main
		{
			padding: 0px;
		}
		-->
		</style>
	</if>
</head>

<body onload="<block name="onload">{onload.CODE};</block>">
<a name="up"></a>
<div id="ajax_waiter"></div>

<div class="mainround">
<call name="cornerTop" />
	<div id="header_forum">
		<p id="img_logo"><a href="{U_INDEX}" ><img id="bannier" src="{IMG_LOGO}" alt="{SITE_NAME}" title="{SITE_NAME}" /></a></p>
		<div id="nom_site">
			<h2>{SITE_NAME}</h2>
			<p id="description">{SITE_DESCRIPTION}</p>
				<b>&#171;</b>
				<ul>
					<switch name="ac_mods_portail"><li><a href="{U_PORTAIL}" title="{LG_FORUM_MENU_PORTAIL_EXPLAIN}">{LG_FORUM_MENU_PORTAIL}</a> - </li></switch>
					
					<li><a href="{U_FAQ}" title="{LG_FORUM_MENU_FAQ_EXPLAIN}">{LG_FORUM_MENU_FAQ}</a> - </li>
					<li><a href="{U_SEARCH}" title="{LG_FORUM_MENU_SEARCH_EXPLAIN}">{LG_FORUM_MENU_SEARCH}</a> - </li>
					<li><a href="{U_USERLIST}" title="{LG_FORUM_MENU_USERLIST_EXPLAIN}">{LG_FORUM_MENU_USERLIST}</a> - </li>
					<switch name="ac_mods_calendar & have_auth_calendar_read"><li><a href="{U_CALENDAR}" title="{LG_FORUM_MENU_CALENDAR_EXPLAIN}">{LG_FORUM_MENU_CALENDAR}</a></li></switch>
				
				</ul>
				<b>&#187;</b>
		</div>
			
		<p id="home_text">{HOME_TEXT}</p>
		<div id="menu"><switch name="is_logged">
		
			<switch name="modo_panel"><h3>{LG_FORUM_MENU_ADMIN} : </h3>
			<ul>
				<switch name="is_admin"><li><a href="{U_ADMIN}">{LG_FORUM_MENU_ADMIN}</a> / </li></switch>
				
				<li><a href="{U_MODO}">{LG_FORUM_MENU_MODO}</a> <if content="$MODO_HAVE_MESSAGE"><b>({MODO_HAVE_MESSAGE})</b></if> / </li>
				<switch name="show_group_modo"><li> <a href="{U_GROUPS_MODO}">{LG_FORUM_MENU_GROUPS}</a></li></switch>
			
			</ul></switch>
				
			
			<h3>{LG_FORUM_MENU_READ} : </h3>
			<ul>
				<li><a href="{U_NOT_READ}">{LG_FORUM_MENU_NOT_READ}</a> / </li>
				<li><a href="{U_OWN_POSTS}">{LG_FORUM_MENU_OWN_POSTS}</a> / </li>
				<switch name="ac_mods_topic_notification"><li><a href="{U_NOTIFICATION}">{LG_FORUM_MENU_NOTIFICATION}</a> / </li></switch>
				
				<switch name="ac_mods_mp"><li><a href="{U_MP}">{LG_FORUM_MENU_MP}</a></li></switch>
			</ul>
			<h3>Autre : </h3>
			<ul>
				<li><a href="{U_PROFILE}">{LG_FORUM_MENU_PROFILE}</a> / </li>
				<li><a href="{U_LOGOUT}">{LG_FORUM_MENU_LOGOUT}</a></li>
			</ul><else>
			<h3>Vos possibilités : </h3>
			<ul>
				<switch name="ac_mods_contact_form"><li><a href="{U_CONTACT}">{LG_FORUM_MENU_CONTACT}</a> / </li></switch>
				<li><a href="{U_LOGIN}">{LG_FORUM_MENU_LOGIN}</a> / </li>
				<li><a href="{U_REGISTER}">{LG_FORUM_MENU_REGISTER}</a></li>
			</ul></switch>
			
		</div>
	</div>
	<switch name="forum_link_header"><include name="navigation.html" /></switch>

	<div class="main">

A noter :
Il y a deux clé de langue que je n'ai pas créé, j'ai directement mis "Autre" et "Vos possibilités".
Bien que dans le code source on suis la logique : bannière, bienvenue, menu, on a pu mettre tout ça où on veut. C'est ça que voulait dire grummfy par modularité.

Dans le fichier ~/tpl/WhiteSummer/main.css

Remplacer :

CSS (Sélectionner le code)

/* Boite contenant le titre et l'image du forum */
#header_forum
{
	width: 100%;
	border: 1px solid #6699bb;
	background-color: #84ccea;
	padding-bottom: 5px;
}

par :

CSS (Sélectionner le code)

/* Boite contenant le titre et l'image du forum */
#header_forum
{
	position: relative;
	border: 1px solid #6699bb;
	background-color: #84ccea;
	background: url('img/bg_header.gif') 0 25px;/* xxpx doit être le même que le top de #img_logo */
	height: 116px;
}

#header_forum h3, #header_forum ul, #header_forum ul li
{
	display: inline;
	margin:0;
	padding:0;
	font-size: 12px;
}

#home_text
{
	left: 10px;
}


#menu
{
	right: 10px;
}

#home_text, #menu
{
	position: absolute;
	top: 5px;
	margin:0;
	padding:0;
	font-size: 11px;
	font-weight: bold;
}

#img_logo
{
	position: absolute;
	top: 25px;/* xxpx doit être le même que dans le background de #header_forum */
	left: 5%;
	margin:0;
	padding:0;
}

#nom_site
{
	position: absolute;
	text-align: center;
	margin: 30px 0 5px 0;
	right: 15%;
}

#description
{
	margin:5px;
	padding:0;
}

Pour faire réapparaître les coins arrondi sous Firefox :

Dans le fichier ~/tpl/WhiteSummer/corner.css

Chercher

CSS (Sélectionner le code)

div.mainround div.corner-top
{
	background-image: url('img/corner-top-left.gif');
}

div.mainround div.corner-top div
{
	background-image: url('img/corner-top-right.gif');
}

Remplacer par :

CSS (Sélectionner le code)

div.mainround div.corner-top
{
	background-image: url('img/corner-top-left.gif');
	z-index: 5000;
}

div.mainround div.corner-top div
{
	background-image: url('img/corner-top-right.gif');
	z-index: 5000;
}

Mon site de jeux en réseau Hamachi :
http://www.jeux-reseau.fr
Le forum : http://forum.jeux-reseau.fr

SquallX

Equipe de support

Age : 18 ans
Messages : 2497
Inscrit : 18 Novembre 2004

09 Novembre 2007, 22:30

Tu as un résultat en ligne ? J'ai rien pour tester là actuellement et j'ai un peu la flemme ^^'

Le theme FSB2 [rc5]