Comment élargir l'interface de mon site web ?

Résolu/Fermé
Thérèse - 19 juil. 2012 à 19:48
 Thérèse - 20 juil. 2012 à 14:53
Bonjour,

Bonjour, je souhaiterai élargir l'interface de mon site web à 100 % de la fenêtre internet, ou au moins la bannière. J'ai déjà mis le width de cette dernnière à 100 % mais je n'ai constaté aucun changement. J'ai aussi mis le width du #conteneur dans habillage.css (je suis sous spip) à 100% il n'a fait qu'augmenter la largeur du corps du texte jusqu'à la rendre égale à celle de ma bannière. Pouvez-vous me proposer autre chose? Je vous remercie d'avance.

A voir également:

6 réponses

maka54 Messages postés 699 Date d'inscription mercredi 8 avril 2009 Statut Membre Dernière intervention 4 décembre 2016 80
19 juil. 2012 à 19:50
montres ton code et ton css
0
Merci pour ta célérité. Voici mon code html :

<div id="colonne1">
<div id="menu1">
<ul>
<li><a href="http://www.histoiredumaghreb.com/Les-Rustumides-ou-Rostemides">Rustumides</a></li>
<li><a href="http://www.histoiredumaghreb.com/Les-Idrissides">Idrissides</a></li>
<li><a href="http://www.histoiredumaghreb.com/Les-Aghlabides">Aghlabides</a></li>
<li><a href="http://www.histoiredumaghreb.com/Le-Maghreb-fatimide-909-969">Fatimides</a></li>
<li><a href="http://www.histoiredumaghreb.com/Les-Almoravides-1056-1147">Almoravides</a></li>
</ul>
</div>
</div>

Et voici mon css :

#menu1 {

/** La couleur du background est definie a noire car on a choisi une image de fond fonc?e */
background: #000 url(koutoubia.jpg) no-repeat;

/** on retire les puces **/
list-style: none;

/** on supprime le padding et les margin par defaut, on rajoute un padding en haut et en bas **/
padding: 40px 0px 20px 0px;
margin: 0px;
width: 126px;

}


#menu1 li {
margin: 5px;
}

#menu1 li a {

/** pour que le lien prenne toute la largeur **/
display: block;

font-size: 1em;
font-family: verdana;
font-weight: bold;
text-decoration: none;

/** par defaut, ecrit en noir sur fond blanc, les liens restent toujours visible */
color: #000;
background: #fff;


/* ces propri?t?s permettent l'effet de transparence sur la plupart des navigateurs
cependant, si un navigateur ne les prend pas en compte, ils n'auront aucun effet mais le menu restera lisible
*/
opacity: 0.7;
filter: alpha(opacity:70);
-khtml-opacity: 0.7;
-moz-opacity: 0.7;

/* note: la valeur 0.7 peut être ajust?e en fonction de l'image de fond
plus la valeur est faible, mois le texte est visible */
}

#menu1 li a:hover {
opacity: 1;
filter: alpha(opacity:100);
-khtml-opacity: 1;
-moz-opacity: 1;


/* sans image le background redevient noir, et le lien blanc, toujours lisible ! */
background: transparent;
color: #fff;
}
0
Désolé, je viens de me rendre compte que ce n'est pas le bon code, je l'ai interverti avec le code que je devais donner sur un autre sujet dans un autre forum. Vraiment désolé. Voici les bonnes informations :

J'ai une boucle spip sur mon sommaire.html html déclinée ainsi :
[(#REM) Entete de la page + titre du site ]
Et voici le code css de la même bannière :
#entete{
display: block;
width: 100%;
height: 220px;
padding: 0;
background-image:url(header.jpg);
background-repeat: no-repeat;
border-bottom: 0;
}
#entete #nom_site_spip {display: none;}

Je voudrais donc étendre cette bannière à 100% de la largeur de la page pour tous les visiteurs. J'ai déjà essayé de mettre le width de #conteneur à 100% dans habillage.css mais sans aucun résultat. Je suis vraiment coincé, j'attends beaucoup de vos réponses. Merci d'avance.
0
rjl Messages postés 543 Date d'inscription mardi 16 mars 2004 Statut Membre Dernière intervention 25 mai 2019 49
19 juil. 2012 à 22:47
Bonsoir,
J'ai vécu ce même problème sans trop m'en souvenir...
Maintenant, j'englobe toute ma page du <body> au </body> d'une division spéciale pour être sur que tout est intégré et que je me réfère toujours à la page : <div class="bloc-page">, laquelle class ne fait quasiment rien... sauf établir la largeur :
.bloc-page {
width : 99,9%;
}
Pour moi, ça avait corrigé ces mêmes problèmes.
Bonne chance RJL2719
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
bg62 Messages postés 23590 Date d'inscription samedi 22 octobre 2005 Statut Modérateur Dernière intervention 15 avril 2024 2 362
20 juil. 2012 à 12:07
avant toutes choses ... prends le temps de t'inscrire et de t'identifier sur le forum , tu auras ainsi certainement plus de réponses ... ;)
0
J'ai résolu le problème en enlevant width: 58em;
à la ligne 67 de la feuille de style habillage.css (je suis sous spip). Merci de votre aide quand même. Je passe en résolu.
0