Probleme affichage parge web - Page 2
Résolu-
le voici
css
/* CSS Document */
body
{
margin: 10px 0 ;
padding: 0 ;
text-align: center ;
font: 0.8em "Trebuchet MS", helvetica, sans-serif ;
background: #dea ;
}
div#conteneur
{
width: 900px;
text-align: left;
border: 2px solid #ab4;
height: auto;
background-color: #fff;
background-position: center center;
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
}
h1#header
{
height: 140px;
margin: 0;
background-image: url(images/3.jpg);
background-repeat: no-repeat;
background-position: center center;
background-attachment: scroll;
}
h1#header a
{
width: 400px ;
height: 70px ;
display: block ;
background: url(title.gif) no-repeat ;
position: relative ;
left: 350px ;
top: 15px ;
}
h1#header a span
{
display: none ;
}
ul#menu
{
height: 35px;
margin: 0;
padding: 0;
background: url(bg_menu.gif) repeat-x 0 -25px;
list-style-type: none;
}
ul#menu li
{
float: left;
text-align: center;
}
ul#menu li a
{
width: 126px;
line-height: 25px;
font-size: 1.4em;
font-weight: bold;
letter-spacing: 2px;
color: #fff;
display: block;
text-decoration: none;
border-right: 2px solid #dea;
font-family: "Times New Roman", Times, serif;
}
ul#menu li a:hover
{
background: url(bg_menu.gif) repeat-x 0 0 ;
}
div#contenu
{
width: 595px;
float: right;
padding-top: 0px;
padding-right: 25px;
padding-bottom: 0;
padding-left: 25px;
}
div#contenumontre
{
width: 595px;
float: right;
padding-top: 0px;
padding-right: 25px;
padding-bottom: 0;
padding-left: 25px;
background-image: url(images/horloge%20pizza%20copiepetit.jpg);
background-repeat: no-repeat;
background-position: left;
margin-top: 0px;
}
div#contenumontre h2
{
padding-left: 25px;
line-height: 25px;
font-size: 2.1em;
color: #9b2;
border-bottom: 1px solid #9b2;
font-weight: bold;
font-family: Georgia, "Times New Roman", Times, serif;
background-image: url(images/little_apple.gif);
background-repeat: no-repeat;
background-position: left bottom;
}
div#contenumontre h3
{
margin-left: 15px;
padding-left: 5px;
border-bottom: 1px solid #9b2;
border-left: 3px solid #9b2;
color: #9b2;
margin-top: 60px;
}
div#contenumontre p
{
text-align: justify;
text-indent: 0em;
line-height: 2.5em;
margin-left: 190px;
font-family: Arial, Helvetica, sans-serif;
font-size: 1em;
margin-top: 0px;
font-weight: normal;
}
div#contenu h2
{
padding-left: 25px;
line-height: 25px;
font-size: 2.1em;
color: #9b2;
border-bottom: 1px solid #9b2;
font-weight: bold;
font-family: Georgia, "Times New Roman", Times, serif;
background-image: url(images/little_apple.gif);
background-repeat: no-repeat;
background-position: left bottom;
}
div#contenu h3
{
margin-left: 15px ;
padding-left: 5px ;
border-bottom: 1px solid #9b2 ;
border-left: 3px solid #9b2 ;
color: #9b2 ;
}
div#contenu p
{
text-align: justify ;
text-indent: 0em;
line-height: 1.7em ;
}
div#contenu a
{
color: #8a0 ;
}
div#contenu a:hover
{
color: #9b2 ;
}
p#menubas
{
margin: 0;
padding-right: 10px;
line-height: 20px;
text-align: right;
color: #8a0;
width: 770px;
}
p#footer
{
margin: 0;
padding-right: 10px;
line-height: 30px;
text-align: right;
color: #8a0;
width: 770px;
}
div#cadre {/* conteneur global et arrière-plan du titre du cadre */
width: 240px;
padding-top: 35px;
float: left;
font-size: 1em;
padding-right: 0px;
background-image: url(images/haut.gif);
background-repeat: no-repeat;
background-position: center top;
}
div#bloccadre {/* arrière-plan bas et sur l'ensemble du cadre */
padding-bottom: 40px;
background-image: url(images/bas.gif);
background-repeat: no-repeat;
background-position: center bottom;
width: 240px;
}
div#bloccadre p {
margin: 0 30px 0 20px;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 1em;
color: #2B2B00;
text-align: center;
}
div#cadrebas {
width:190px;
height: auto;
text-align: center;
background-color: #cde699;
border: thick double #99CC33;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 1em;
color: #2B2B00;
padding: 5px;
left: 0px;
right: 0px;
margin: 20px;
top: 0px;
bottom: 0px;
}
div#pied_page {
clear:both;
width:900px;
height:0px;
}
pre
{
overflow: auto ;
background: #dea ;
border: 2px solid #9b2 ;
padding: 5px 0 0 5px ;
font-size: 1.2em ;
}
pre span
{
color: #560 ;
}
pre span.comment
{
color: #b30000 ;
}
ul#prod li p, .texte{
margin-top: 2px;
padding-bottom: 2px;
padding-left: 20px;
line-height: 16px;
background-color: #FF0000;
background-image: url(../images/ok.gif);
background-repeat: no-repeat;
background-position: left center;
border-top-width: 1px;
border-bottom-width: 1px;
border-top-style: solid;
border-bottom-style: solid;
border-top-color: #000000;
border-bottom-color: #000000;
text-align: center;
}
.imgz a img {
display: inline;}
</style>
html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Bienvenue Pizzeria Pico Bello - Saint Louis - Restaurant Pizzeria</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="author" content="Pico Bello">
<meta name="description" content="Pizzéria Pico Bello situé à Saint-Louis 68300 Spécialité Italienne, Ambiance chaleureuse, Grande terrasse situé a l'arrière, menu du jour le midi">
<meta name="keywords" content="pico bello, pizzeria, pizza, pico bello saint louis, pico-bello, specialité italienne,pizzéria, pâtes, menu du jour, salades, viandes, poissons, 68300, 68">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-15" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Language" content="fr" />
<!--[if IE]>
<style type="text/css">
html pre
{
width: 636px ;
}
</style>
<![endif]-->
<SCRIPT LANGUAGE="JavaScript">
function nouvellefenetre() {
mafenetre =
window.open("http://picobello.free.fr/news/news/","MyPopupWindow","resizable=no,menubar=no,status=no,scrollbars=no,menubar=no, width=700, height=200");
}
</SCRIPT>
<!-- phpmyvisites -->
<!--
var a_vars = Array();
var pagename='';
var phpmyvisitesSite = 1;
var phpmyvisitesURL = "http://picobello.free.fr/phpmv2/phpmyvisites.php";
//-->
</script>
<script language="javascript" src="http://picobello.free.fr/phpmv2/phpmyvisites.js" type="text/javascript"></script>
<object><noscript><p>phpMyVisites | Open source web analytics
<img src="http://picobello.free.fr/phpmv2/phpmyvisites.php" alt="Statistics" style="border:0" />
</p></noscript></object></a>
<!-- /phpmyvisites -->
<link type="text/css" rel="stylesheet" media="screen" href="all.css" />
<style type="text/css">
<!--
.Style1 {
font-size: 1.3em;
font-weight: bold;
}
-->
</style>
</head>
<body>
<div id="conteneur">
<h1 id="header"><a href="logo" title="Pico-Bello"><span>Colored Design</span></a></h1>
<ul id="menu">
<li><a href="index.html">Acceuil</a></li>
<li><a href="specialites.html">Spécialités</a></li>
<li><a href="soiree.html">Soirées</a></li>
<li><a href="horraire.html">Horaires</a></li>
<li><a href="photo2test.html">Photos</a></li>
<li><a href="acces.html">Accès</a></li>
<li><a href="contact22.php">Contact</a></li>
</ul>
<ul id="menu">
<li><a href="agb/or.php">Livre d'Or </a></li>
<li><a href="javascript:nouvellefenetre()">Newsletter</a></li>
</ul>
<p id="menubas"> </p>
<div id="cadre">
<div id="bloccadre">
<p><strong>Menu au choix </strong></p>
<p> </p>
<p>Salade, plat et desserts</p>
<p> </p>
<p>Menu Pâtes 9€<br />
Menu Pizza 9.5€<br />
Menu viandes ou poissons 10€</p>
</div>
<div id="cadrebas">
<p class="Style1">Newsletter</p>
<p>Inscrivezvous à la newsletter Pico-Bello et recevez un apéritif pour votre prochaine visite<br />
<br />
<a href="javascript:nouvellefenetre()">Cliquez ici</a>
</div>
</div>
<div id="contenu">
<h2>Bienvenue Pizzeria Pico-Bello</h2>
<p> Une décoration chaleureuse agrémente vos repas,
entièrement refaite pour votre plus grand plaisir.<br />
Le Pico-Bello peut désormais accueillir plus de
50 convives autour d'une cuisine traditionnelle
Italienne uniquement réalisée avec des produits frais ! </p>
<h2>Site en construction </h2>
<p1>.....</p1>
<h3 class="Style2"> </h3>
<p1>.</p1>
<h3> </h3>
<p1>.</p1>
</div>
<p id="footer"> </p>
<div id="pied_page"></div>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://fpdownload2.macromedia.com/get/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="900" height="60" title="bas de page">
<param name="movie" value="images/basdepage.swf" />
<param name="quality" value="high" />
<embed src="images/basdepage.swf" quality="high" pluginspage="https://get.adobe.com/flashplayer/" type="application/x-shockwave-flash" width="900" height="60"></embed>
</object>
</div>
</body>
</html>
voila les codes
merci de votre aide -
Essai de mettre les tailles des polices en pixel au lieu de em.
-
ok je vais essaier je te tiens au courant demain je dois aller bosser merci de ton aide
-
bonjour
Je viens de le mettre a 20 pixel uniquement le menu et effectivement je n es plus se probleme
je vais donc mettre tous les tailles de polices en pixel
connait tu la difference entre pixel et ems?
par contre pour le cadre de gauche as tu une odée de quoi cela peut provenir?
merci de ton aide -
Sur div#bloccadre tu spécifie un
margin: 0 30px 0 20px;
que tu ne met pas sur div#cadre. Essai de le mettre dessus également. -
je viens de le modifier
mais maintenant dans dreamweaver il est decalé comme sur l image de hier que tu m as montrer
mais sous IE 7 il est bon
pourrais tu me dire si sous IE 6 c est ok?
merci de ton aide -
T'a pas de margin sur div#bloccadre. ça viens peut-être ça.
En fait sur le div#cadre, si tu met un margin 10 à droit, ça te fera 240+10 en largeur total.
En plus tu as mismargin: 0 10px 0 0px;
Pour que ça marche faut mettre:margin: 0px 10px 0px 0px;
Toutefois, essai avec:margin: 0px;
Celui de départ, tu l'avais mis uniquement sur le <p>
-
Arthezius, je vois que tu es Webmaster indépendant, du coup, j'ai une petite question à te poser, ou plutôt, j'aurai besoin de tes compétences pour un projet perso'.
Je suis Webmaster débutant, je développe actuellement mon portfolio et j'ai souhaité y intégrer un peu d'AJAX.
En ce moment, depuis plusieurs jours, je bute sur ce prob' : comment créer un système de fenêtres comme Windows par exemple ?
J'ai essayé de piger, de manier le Prototype Window Class (PWC), qui est assez connu, et que je trouve le plus abouti, mais rien à faire, faible doc' + faibles compétences = 0 résultats.
Si jamais tu saurais m'expliquer comment ça marche, si tu y as déjà touché, je t'en serais très reconnaissant !
Aide-moi dès que tu pourras s'il te plaît, enfin si ça te dérange pas, ça presse pas et peut être as-tu d'autres priorités aussi. -
@XanderS2XAJAX je touche pas encore du tout. J'en reste pour le moment à HTML/CSS + PHP/MySQL.
Je ne pourrai donc pas t'aider.
Désolé. -
@artheziusOk, c'est rien, merci quand même d'avoir voulu ;) !
-
-
je viens de mettre margin 0px mais ca ne vas tjrs pas je suis decalé sur dreaweaver regarde ici http://picobello.free.fr/picocadre.jpg
c es bizare que ca ne marche pas
sous iE 6 c est comment?
merci de votre aide -
Met:
<div id="bloccadre"> <p><img src="images/haut.gif" /></p> <p><strong>Menu au choix </strong></p> <p> </p> <p>Salade, plat et desserts</p> <p> </p> <p>Menu Pâtes 9€<br /> Menu Pizza 9.5€<br /> Menu viandes ou poissons 10€</p> </div>
Et enlève l'image du fond du div "cadre".
Vois ce que ça donne. -
je viens de faire ce que tu as dit mais c es pas encore ca il est decaler de quelque pixel
regarde ici http://picobello.free.fr/pico2.jpg
et j ai enleve le fond sur div cadre
merci -
je viens de trouver j ai agrandi la largueur de div cadre et div bloc a 255 et mis un marge sur bloaccadre p de 0px 15px 0px 0px et la c es devenu bon et la c es devenu bon IE 7 mais je ne sais pas sous IE6
merci de votre aide c es tres gentil je ne savait pas que tu pouvais mettre une image comme tu m as dit merci beaucoup -
Là c'est bon.
Donc problème résolu. -
ok cool marci de votre aide
-
De rien. On est là pour ça, donc n'hésite pas.
-
ok pas de probleme je reviendrais
Précédent
- 1
- 2
