28172 sujets

CSS et mise en forme, CSS3

Bonjour,
Depuis deux jours j'essaye de mettre en page un calendrier développé en PHP et générant une liste (voir le code du calendrier ci-dessous)
Le problème c'est que j'arrive plus ou moins a un résultat convenable sur IE mais c'est la cata sur les autres navigateurs quelle est la bonne solution CSS pour ce genre de mise en page ? (j'aimerais une mise en page un peu comme ceci: http://www.netevents.be/fr/)
Merci d'avance

<div class="calendarcontent">

	<ul id="libelle">

		<li>Lu</li>

		<li>Ma</li>

		<li>Me</li>

		<li>Je</li>

		<li>Ve</li>

		<li>Sa</li>

		<li>Di</li>

	</ul>

	<ul class="ligne">

		<li class="calendarOldDate">1</li>

		<li class="calendarOldDate">2</li>

		<li class="calendarOldDate">3</li>

		<li class="calendarOldDate">4</li>

		<li class="calendarOldDate">5</li>

		<li class="calendarOldDate">6</li>

		<li class="calendarOldDate">7</li>

	</ul>

	<ul class="ligne">

		<li class="calendarOldDate">8</li>

		<li class="calendarOldDate">9</li>

		<li class="calendarOldDate">10</li>

		<li class="calendarOldDate">11</li>

		<li class="calendarOldDate">12</li>

		<li class="calendarOldDate">13</li>

		<li class="calendarOldDate">14</li>

	</ul>

	<ul class="ligne">

		<li class="calendarOldDate">15</li>

		<li class="calendarOldDate">16</li>

		<li class="calendarOldDate">17</li>

		<li class="calendarOldDate">18</li>

		<li class="CalendarNowDate"><a href="?date=19-08-2011">19</a></li>

		<li class="CalendarEventDate"><a href="?date=20-08-2011">20</a></li>

		<li class="CalendarFuturDate"><a href="?date=21-08-2011">21</a></li>

	</ul>

	<ul class="ligne">

		<li class="CalendarFuturDate"><a href="?date=22-08-2011">22</a></li>

		<li class="CalendarFuturDate"><a href="?date=23-08-2011">23</a></li>

		<li class="CalendarFuturDate"><a href="?date=24-08-2011">24</a></li>

		<li class="CalendarFuturDate"><a href="?date=25-08-2011">25</a></li>

		<li class="CalendarFuturDate"><a href="?date=26-08-2011">26</a></li>

		<li class="CalendarFuturDate"><a href="?date=27-08-2011">27</a></li>

		<li class="CalendarFuturDate"><a href="?date=28-08-2011">28</a></li>

	</ul>

	<ul class="ligne">

		<li class="CalendarFuturDate"><a href="?date=29-08-2011">29</a></li>

		<li class="CalendarFuturDate"><a href="?date=30-08-2011">30</a></li>

		<li class="CalendarFuturDate"><a href="??date=31-08-2011">31</a></li>

		<li>&nbsp;</li>

		<li>&nbsp;</li>

		<li>&nbsp;</li>

		<li>&nbsp;</li>

	</ul>

</div>
Bonjour, je vais pas répondre directement à ta question mais vu l'exemple que tu proposes pourquoi ne pas s'orienter vers un tableau?!
+1

La liste est completement inapropriée ici (les listes d'ailleurs, ce qui est pire).

Un calendrier est bel et bien un tableau, donc les éléments de tableaux sont la meilleure option.
Un petit doublon, non ?
Je copie la judicieuse remarque de boulaneige et je ferme l'autre sujet Smiley cligne
boulaneige a écrit :

Salut,
Un tableau serait parfaitement approprié pour ce type de contenu.
En l'état, si tu désactives les styles ou si tu as une lecture linéaire, ce n'est plus un calendrier mais une suite de listes qui n'ont plus aucun sens.
Avec un tableau, tu as des entêtes (#libelle) et des lignes (.lignes). Sans CSS, ça reste un tableau. En lecture linéaire, le "lien" reste, il peut même être enrichi (id, scope, headers).