Comment fait-on un corps extensible ?

Sujet résolu

5 janvier 2006 à 23:38:44

Bonsoir,
Apres presque 2 mois de travail sur mon site je tourne en rond o_O

.
Je vais essayer de vous expliquer pourquoi et si vous pouvez m'aider se serait sympa.
Je pense ne pas avoir compris un chapitre du tuto ou alors mon cerveau la zappé o_O

.
En fait j'aimerai que mon site est un design tout simple menu à droite et a gauche et un corps au milieu. Jusque là no souci.
Le souci est dans mon corps. Celui ci est differents dans chaque page. En effet certaines pages ont un seul corps et d'autres plusieurs jusqu'à 4. J'ai essayé avec un seul fichier css la folie................... Certaines pages se retrouvaient en parfait bazar. Donc j'ai commencé à faire un fichier css par page et depuis ce jour la je tourne en rond quand je modifie une chose par exemple l'interieur d'un corps le bazar est de retour. Je pense que cela vient de l'hérédité mais j'en suis pas sûre. :euh:

D'un cou ce soir EUREKA......et c'est la que j'ai besoin d'aide
Si je remets tout mon css dans un seul fichier comment dois je faire pour que le corps s'adapte au contenu???? Ou alors dois je nommé chaque corps différement???? et le souci d'hérédité???? Faire un lien vers une ancre situé au centre de mon site???? (j'avoue ne pas bien compris le tuto sur l'ancre mais si la est la solution je me replonge dedans)

Désolé pour la longueur du message et j'espère avoir été claire

Je n'ai pas mis les codes css pour ne pas encombré mais si vous avez besoin n'hésitez pas à demander

Encore merci à tous ceux qui pourront m'aider

Anonyme

6 janvier 2006 à 0:15:44

Bonjour,

Pourriez-vous me montrer le design et je vais voir si il peut être extensible ou pas et je vais vous montrer comment.

sandrine26

6 janvier 2006 à 0:22:52

ci dessous l'image de la page d accueil
Image utilisateur

marty

6 janvier 2006 à 1:59:51

le principe du css est de ne pas avoir à se taper à coder 50 000 choses,
le première chose serais pour moi de refaire le css de façon à ce qu'il ni y'en ai pas 50 !!
avais vous un lien pour pouvoir vérifier votre site en ligne ???

sandrine26

6 janvier 2006 à 16:32:10

salut,
désolé le nouveau site n'est pas en ligne.
j'avais bien compris le css servait à ne pas répéter Xfois les choses. Le souci c'est quand j'applique le même fichier css à toutes mes pages (en indiquant plusieurs nom de corps corps1 corps2 etc) tout mon site devien en bazar je pensu qu s'est un pb d'hérédité

sandrine26

7 janvier 2006 à 16:40:41

Bonjour,
Personne a repondu à ma question donc je renouvelle. Entre temps je vais refaire mon fichier css

Anonyme

7 janvier 2006 à 16:55:22

Tu veux un design extensible ?
Si tu a une image:

{
background-image: repeat-x;
}

sandrine26

8 janvier 2006 à 2:06:13

onsoir
je vien de refaire mon fichier css et la desastre sous fx no souci mais sous IE le bazar. Je vous mets ci dessous les images et le code css concerné je ne vous ai pas mis l'accueil sous fx car c est no souci. Concernant mention legales sous fx et sous ie c'est le meme fichier css
merci pour votre aide

ACCUEIL SOUS IE Image utilisateur

MENTION LEGALES SOUSFX Image utilisateur

MENTION LEGALES SOUSIE Image utilisateur

body
{
background-color: rgb(251,250,200);
font-family: Georgia,"Comic Sans MS", "Trebuchet MS", serif;
width: 760px;
margin-top: 0px;
margin-bottom: 20px;

}

#logo
{
width: 250px;
height: 109px;
background-image: url("../images/logo.gif");
background-repeat: no-repeat;
margin-bottom: 10px;
position:absolute;
left:35px;
top:30px;

}
#pied_de_page
{
width: 250px;
height: 20px;
position: absolute;
left:35px;
top:140px;
color: rgb(161,75,0);
font-size:10px;
text-align:center;

}
#baniere
{
width: 800px;
height: 120px;
background-image: url("../images/baniere.gif");
background-repeat: no-repeat;
position:absolute;
left:300px;
top:35px;
}

#en_tete_date
{
width: 600px;
height:10px;
font-size: 12px;
font-variant: small-caps;
background-repeat: no-repeat;
margin-bottom: 5px;
position:absolute;
left:300px;
top:170px;
color: rgb(254,191,1);
text-align:center;
}

#texteindex
{
width: 600px;
font-size: 14px;
font-variant: small-caps;
background-repeat: no-repeat;
margin-bottom: 5px;
position:absolute;
left:250px;
top:200px;
color: rgb(41,194,0);
text-align:justify;
}

#nouveauteindex
{
width: 760px;

position:absolute;
left:350px;
top:450px;

}
caption
{
color:rgb(151,75,0);

}

#nouveautedessin
{
width: 760px;

position:absolute;
left:500px;
top:450px;

}
caption
{
color:rgb(151,75,0);

}

#supportnouveaute
{
width: 760px;

position:absolute;
left:650px;
top:450px;

}
caption
{
color:rgb(151,75,0);

}

#corps4
{
width: 600px;
font-size: 14px;
font-variant: small-caps;
background-repeat: no-repeat;
margin-bottom: 5px;
position:absolute;
left:180px;
top:0px;
color: rgb(41,194,0);
}

#menu h4
{
text-align:center;
font-size:12px;
}

#menu
{
float: left; /* Le menu flottera à gauche */
width: 150px; /* Très important : donner une taille au menu */
position:absolute;
left:85px;
top:200px;
font-size: 12px;

}

.element_menu
{
background-color:rgb(216,247,145);
background-repeat: repeat-x;

border: 2px solid black;

margin-bottom: 20px; /* Pour éviter que les éléments du menu ne soient trop collés */
}

.element_menu a
{
text-decoration: none; /* Les liens ne seront plus soulignés */
color: rgb(161,75,0);
font-style: gras;
}

.element_menu a:hover /* Quand on pointe sur un lien du menu */
{
background-color: rgb(140,255,140);
color: black;
}

#menu1 h4
{
text-align:center;
font-size:12px;
color:black;
}

#menu1
{
float: right; /* Le menu flottera à droite */
width: 150px; /* Très important : donner une taille au menu */
position:absolute;
right:85px;
top:200px;
font-size: 12px;
}

.element_menu1
{
background-color:rgb(216,247,145);
background-repeat: repeat-x;

border: 2px solid black;
color: rgb(161,75,0);
margin-bottom: 20px; /* Pour éviter que les éléments du menu ne soient trop collés */
text-align:center;

}

.element_menu ul /* Toutes les listes à puces se trouvant dans un menu */
{
list-style-image: url("../images/puce.gif"); /* On change l'apparence des puces */
padding: 0px; /* Tous les côtés ont une marge intérieure de 0 pixels */
padding-left: 20px; /* ... mais on modifie ensuite la marge de gauche, donc celle-là fera finalement 20 pixels */
margin: 0px; /* Idem pour margin, ça nous évite d'avoir à en écrire 4 (margin-left, margin-right...) */
margin-bottom: 5px; /* Même chose que tout à l'heure, on modifie ensuite juste margin-bottom, mais tous les autres sont à 0px */
}

.element_menu1 a
{
text-decoration: none; /* Les liens ne seront plus soulignés */
color: rgb(161,75,0);
font-style: gras;
}

.element_menu a:hover /* Quand on pointe sur un lien du menu */
{
background-color: rgb(140,255,140);
color: black;
}

Encore une fois merci de votre aide

jp949

8 janvier 2006 à 9:54:57

le mieux pour toi est que tu fasse une image en 750px X 500px avec les blocs primaires dessines et les images a incorporer en background et tu
envoies ca

sandrine26

8 janvier 2006 à 15:43:51

Voici le lien qui permet de mieux comprendre:
http://www.msnimpression.com/TestsPHP/index.php
Merci d avance

jp949

8 janvier 2006 à 16:20:27

tu veux faire un design extensible et tu mets body 760px qui plus est la banniere 800px et toutes tes nouveautes en absolute qui sortent de la page
je l'ai retouché il est a cette adresse , s'affiche sous IE, opera; FF, nscape
ici

sandrine26

8 janvier 2006 à 17:23:47

Je te remercie à l'attention qur tu as porté à mon problème. La présentation que tu me proposes est sympa et un peu plus aéré. Le souci c'est que quand je clique sur mention legales (qui a le meme fichier css que l'accueil) le problème est toujours la sous IE

jp949

8 janvier 2006 à 17:44:58

il est surtout extensible avant d'etre aeré et pour ton fichier mentions legales le css n'est surement pas le meme

sandrine26

8 janvier 2006 à 18:40:42

je viens de t envoyer un mp. En fait j ai fait un copier/coller du lien concernant le fichier css dans le head

sandrine26

10 janvier 2006 à 15:16:46

Comment dois je faire pour recuperer le fichier css ou alors que dois je changer sur le mien pour qu'il devienne extensible. A savoir j'ai résolu mon problème concernant le menu une erreur s'était glissée dedans.
D avance merci

sandrine26

11 janvier 2006 à 22:59:30

juste pour remonter le topic et pour pas qu il tombe dans les oubliettes
merci

jp949

12 janvier 2006 à 4:44:27

je t'ai donné l'adresse par MP pour voir tes pages en ligne.
Le fichier css il suffit d'afficher la source et relever le "link =href".... " " dans le <head>

sandrine26

12 janvier 2006 à 9:46:33

oui mais la je tombe sur ton serveur!!!! Non je me trompe????
car moi j ai psa le fichier sand_.......css
Merci

jp949

12 janvier 2006 à 10:09:53

je t'envoie le code css en MP

sandrine26

12 janvier 2006 à 10:51:02

Merci beaucoup c est super gentil