Page 1 sur 1

Menu en css

Publié : 07 janv. 2004, 03:26
par Frédéric
Bonsoir,

Je suis entrain d'essayer de faire mon menu en css...

L'original avec des tables est :

Le code html "classique" est le suivant :

Code : Tout sélectionner

<table border="0" cellspacing="0" class="tablemenu">
  <tr  class="lignehaut">
    <td width="105" rowspan="2"><a class="logo" href="/accueil/accueil.php" title="retour ACCUEIL"></a></td>
    <td width="63" height="40"><a class="news" href="/actualite/actu.php" title="page NEWS"></a></td>
    <td width="77"><a class="bio" href="/biographie/bio.php" title="page BIOGRAPHIE"></a></td>
    <td width="86"><a class="disco" href="/discographie/discographie.php" title="page DISCOGRAPHIE"></a></td>
    <td width="88"><a class="technique" href="/techniques/technique.php" title="page TECHNIQUES"></a></td>
    <td width="88"><a class="biblio" href="/techniques/bibliographie.php" title="page BIBLIOGRAPHIE"></a></td>
    <td width="62"><a class="luthier" href="/Luthiers/Luthiers.php" title="page LUTHIERS"></a></td>
    <td width="79"><a class="partitions" href="/partitions/Partitions.php" title="page PARTITIONS"></a></td>
    <td width="68"><a class="goodies" href="/wallpaper/goodies.php" title="page GOODIES"></a></td>
    <td width="73"><a class="liens" href="/liens/liens.php" title="page LIENS"></a></td>
  </tr>
  <tr class="lignebas">
    <td height="48"><a class="videos" href="/news/videos/videos.php" title="page VIDEOS"></a></td>
    <td height="48"><a class="forum" href="/phorum/list.php" title="Forum de discussion"></a></td>
    <td width="88" height="48"><a class="contemporains" href="/contemporain/index.php" title="page CONTEMPORAINS"></a></td>
    <td height="48">&nbsp;</td>
    <td height="48">&nbsp;</td>
    <td height="48">&nbsp;</td>
    <td height="48">&nbsp;</td>
    <td width="68">&nbsp;</td>
    <td width="73">&nbsp;</td>
  </tr>
</table>
J'ai commencé à créer un

Code : Tout sélectionner

<div id="menuhaut"><a class="logo" href="/accueil/accueil.php" title="retour ACCUEIL"></a></div>
et j'ai indiqué en css

Code : Tout sélectionner

#menuhaut {
position: fixe;
        width: 100%;
        height: 88px;
        top: 0;
        right: 0;
        bottom: auto;
        left: 0;
		background-image:url(/accueil/menupics/lignes.gif);
}
Mon problème est que je ne sais pas comment faire pour créer une "cellule après mon logo pour y insérer les autres images et je ne sais pas comment insérer des cellules en dessous pour intégrer le second background et les autres images.

Le resultat du début du menu en css est

Si quelqu'un peut m'expliquer ou bien me communiquer l'adresse d'un site je lui en saurais tres reconnaissant :)

Publié : 07 janv. 2004, 14:16
par fredroy
Bien :) j'ai réussis finalement...

J'ai une autre question... Comment faire pour que les blocs soient elastiques ?
C'est à dire qu'il s'étirent dans le sens de la largeur lorsque l'on redimensionne la fenêtre et non qu'ils soient fixes ?

Et comment faire pour que l'ensemble des blocs fassent 100% de la fenêtre ?

Merci d'avance pour votre aide :)

Publié : 07 janv. 2004, 15:45
par SIBELIUS
J'arrive un peu tard, mais voici :
- comment faire un menu propre : http://www.alsacreations.com/articles/menu/
- des modèles de mise en page dont certains occupent 100% de large : http://www.alsacreations.com/articles

Publié : 07 janv. 2004, 18:18
par Invité
Merci beaucoup, je m'en suis servi et j'ai tout modifié.

Mais je n'arrive pas à insérer la suite des images.

Code : Tout sélectionner

<div class="menu">
	<ul><li><a class="logo" href="/accueil/accueil.php"></a></li>
	<li><a class="news" href="/actualite/actu.php"></a></li>
	<li><a class="bio" href="/biographie/bio.php"></a></li>
	<li><a class="disco" href="/discographie/discographie.php"></a></li>
	<li><a class="technique" href="/techniques/technique.php"></a></li>
	<li><a class="biblio" href="/techniques/bibliographie.php"></a></li>
	<li><a class="luthier" href="/Luthiers/Luthiers.php"></a></li>
	<li><a class="partitions" href="/partitions/Partitions.php"></a></li>
	<li><a class="goodies" href="/wallpaper/goodies.php"></a></li>
	<li><a class="liens" href="/liens/liens.php"></a></li>
	</ul>
</div>
J'ai beau chercher , je ne trouve pas comment faire pour insérer les images dans le même bloque en dessous de "news".

Merci d'avance si tu sais comment procéder :)

Publié : 07 janv. 2004, 22:08
par gaerun
Bonsoir Frederic.

Je sais, ça n'a rien à voir avec le sujet de la discussion, mais quand on est à la racine de ton site, on a que l'animation flash pour accéder à la suite. Et tout le monde n'a pas de plugin flash.

Alors si tu pouvais mettre juste un petit lien vers la suite, ça améliorerait l'accessibilité de ton site (qui par ailleurs est super intéressant. Bravo).

Publié : 12 janv. 2004, 03:46
par fredroy
c'est chose faite :)