Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1532 connectés 

  FORUM HardWare.fr
  Graphisme
  Web design

  [Resolu] Conseil pour le graphisme d'un site politique

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

[Resolu] Conseil pour le graphisme d'un site politique

n°1026986
Sephirius2
Posté le 21-07-2008 à 16:30:32  profilanswer
 

Bonjour à tous, on m'a proposé de créer un kit graphique pour un site web au couleur politique (Belgique, je n'en dirai pas plus  :ange: ).
 
Donc j'ai réalisé un premier kit que je monte via un CSS et je construit une page html tt simple... Jusque la tout va bien... mais jusque mtnt je n'avais jamais travaillé en 1024 et je suis perdu... mon header est coupé il manque presque 2 cm à l'écran et il manque 2 cm sur tout le coté droit de mon site... ça me pose un petit problème surtout que je ne maitrise pas encore les codes CSS pr un site extensible.
 
Donc j'aurais besoin d'une infos... soit je crée un site extensible mais pour mettre ma bannière en flash ds un futur proche j'aurai des ruses, ou bien vous m'indiquez sous quel taille je dois développer mon kit graphique ou comment modifier mon CSS en sachant que j'ai défini le "body pour 1024"
 
Voila le code CSS (allégé juste les cadre principaux)

Code :
  1. /*la page*/
  2. body
  3. {
  4.    width: 1024px;
  5.    margin: auto;
  6.    margin-top: 20px;
  7.    margin-bottom: 20px;   
  8.    background-image: url("images/background_theme1.png" );
  9. }
  10. /* L'en-tête */
  11. #en_tete
  12. {
  13.    width: 1024px;
  14.    height: 180px;
  15.    background-image: url("images/banniere.png" );
  16.    background-repeat: no-repeat;
  17.    margin-bottom: 10px;
  18. }
  19. /* Le menugauche*/
  20. #menugauche
  21. {
  22.    float: left;
  23.    width: 180px;
  24. }
  25. /*partie 1 = rechercher */
  26. .recherche
  27. {
  28. background-color: ;
  29. background-image: url("images/lateralg.jpg" );
  30. background-repeat: repeat;
  31. }
  32. .recherche form
  33. {
  34.    padding: 0px;
  35.    padding-left: 5px;
  36.    margin: 5px;
  37.    margin-bottom: 5px;
  38. }
  39. /*partie 2 = Menu 1&2 */
  40. .menugauche
  41. {
  42.    background-color: ;
  43.    background-image: url("images/lateralg.jpg" );
  44.    background-repeat: repeat;
  45.  
  46.    /*border: 2px solid black;  (utile pr la construction) */
  47.  
  48.    margin-bottom: 20px;
  49. }
  50. /* Quelques effets sur les menus */
  51. .menugauche h3
  52. {   
  53.    color: #B3B3B3;
  54.    font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
  55.    text-align: center;
  56. }
  57. .menugauche ul
  58. {
  59.    list-style-image: url("images/leftpuce2.png" ); /* On change l'apparence des puces */
  60.    padding: 0px;
  61.    padding-left: 20px;
  62.    margin: 10px;
  63.    margin-bottom: 5px;
  64. }
  65. .menugauche a
  66. {
  67.    color: #FFFAFA; /*snow*/
  68. }
  69. .menugauche a:hover
  70. {
  71.    background-color: #800000; /*Maroon*/
  72.    color: #FF4500; /*OrangeRed*/
  73. }
  74. /* Le menudroit*/
  75. #menudroit
  76. {
  77.    float: right;
  78.    width: 180px;
  79. }
  80. .menudroit
  81. {
  82.    background-color: ;
  83.    background-image: url("images/lateralg.jpg" );
  84.    background-repeat: repeat;
  85.  
  86.    /*border: 2px solid black;  (utile pr la construction) */
  87.  
  88.    margin-bottom: 20px;
  89. }
  90. /* Quelques effets sur les menus */
  91. .menudroit h3
  92. {   
  93.    color: #B3B3B3;
  94.    font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
  95.    text-align: center;
  96. }
  97. .menudroit ul
  98. {
  99.    list-style-image: url("images/leftpuce2.png" );
  100.    padding: 0px;
  101.    padding-left: 20px;
  102.    margin: 10px;
  103.    margin-bottom: 5px;
  104. }
  105. .menudroit a
  106. {
  107.    color: #FFFAFA; /*snow*/
  108. }
  109. .menudroit a:hover
  110. {
  111.    background-color: #800000; /*Maroon*/
  112.    color: #FF4500; /*OrangeRed*/
  113. }
  114. /* Le corps de la page */
  115. #corps
  116. {
  117.    margin-left: 190px;
  118.    margin-right: 190px;
  119.    margin-bottom: 20px;
  120.    padding: 5px;
  121.  
  122.    color: #B3B3B3;
  123.    background-color: #626262;
  124.    background-image: url("images/motif.png" );
  125.    background-repeat: repeat-x;
  126.  
  127.    border: 2px solid black;
  128. }
  129. #corps h1
  130. {
  131.    color: #B3B3B3;
  132.    text-align: center;
  133.    font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
  134. }
  135. #corps h2
  136. {
  137.    height: 30px;
  138.    background-image: url("images/titre.png" );
  139.    background-repeat: no-repeat;
  140.  
  141.    padding-left: 30px;
  142.    color: #B3B3B3;
  143.    text-align: left;
  144. }
  145. /* Le pied de page */
  146. #pied_de_page
  147. {
  148.    padding: 5px;
  149.    text-align: center;
  150.    color: #B3B3B3;
  151.    background-color: #626262;
  152.    background-image: url("images/motif.png" );
  153.    background-repeat: repeat-x;
  154.  
  155.    border: 2px solid black;
  156. }


 
Si en lisant mon CSS vous avez une idée de simplification je suis preneur bien sur...
 
Merci


Message édité par Sephirius2 le 24-07-2008 à 16:47:59
mood
Publicité
Posté le 21-07-2008 à 16:30:32  profilanswer
 

n°1027022
Lactique
Caraïbe et huile de coco
Posté le 21-07-2008 à 23:52:30  profilanswer
 

En une phrase , c'est quoi ton probleme au juste ?


---------------
Studio CréeAll
n°1027026
autokicker
Posté le 22-07-2008 à 00:07:54  profilanswer
 

C'est clair qu'avec juste le CSS complètement déconnecté du xHTML, je vois pas trop ce qu'on peut en dire... :P


---------------
Blog Musical Spleen-esque - Galerie d'Inspiration Webdesign - Jeux Gratuits en Flash
n°1027078
genghis77
-_-'
Posté le 22-07-2008 à 14:03:04  profilanswer
 

moi je verrais bien un fond noir et du texte noir :D


---------------
Genghis achat/vente
n°1027093
wizopunker
FUCK ANARCHY!
Posté le 22-07-2008 à 14:54:42  profilanswer
 

avec un slogan blanc "il y a trop de noir"...
:D
Perso tant que je sais même pas pour quel genre de parti politique c'est.. voila quoi :lol:


---------------
| .:: www.wizopunk-art.com - Développement web ::. |
n°1027101
crayon29
mine de rien...
Posté le 22-07-2008 à 15:10:11  profilanswer
 

wizopunker a écrit :

avec un slogan blanc "il y a trop de noir"...
:D


Waciste !!
     /
 [:pape diouf]


---------------
www.crayon29.com (incompatible IE) -- Liverpowen a écrit: Moi quand je suis bourré, je suis gay  :o
n°1027371
Sephirius2
Posté le 24-07-2008 à 14:48:53  profilanswer
 

Pas bete le coup du html... mais j'ai résolu mon problème.
Encore merci d'avoir perdu un peu de votre temps


Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Graphisme
  Web design

  [Resolu] Conseil pour le graphisme d'un site politique

 

Sujets relatifs
Site permettant d'heberger musique et video en flux directaide template site en flash
site flash quelle tailleconseil sur les logiciels 3d pour école d'infographie 3d
Site d'annonces en ligneQue pensez-vous de ce site ? [ Mise à jour ]
Creation de logo pour mon sitesite de kits graphiques ?
[résolu] Autocad: exploder des blocs 
Plus de sujets relatifs à : [Resolu] Conseil pour le graphisme d'un site politique


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR