28172 sujets

CSS et mise en forme, CSS3

Avis sur mon code

bonjour

je voudrais savoir si quelqu'un peux me dire
si mon code est faux car je n'arrive pas à resoudre mon probleme
d'adaptation de mon site selon la resolution d'ecran de la personne
qui regarde mon site

merci de me conseiller

j'ai rajouter le code de http://css.alsacreations.com/Tutoriels-et-articles-divers/Faire-un-site-pour-toutes-les-resolutions

div {
width: 80%;
max-width: 1000px;
min-width: 700px;
}


mais ça ne marche pas 


<!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>RnSoul : l'empreinte du nouveau son</title>
<style type="text/css">
<!--
div {
width: 80%;
max-width: 1000px;
min-width: 700px;
}

.style14 {	color: #FFFFFF;
	font-weight: bold;
	font-size: 12px;
}
.style15 {	color: #000000;
	font-weight: bold;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
}
.style2 {	color: #FFFFFF;
	font-weight: bold;
	font-size: 10px;
	font-family: Arial, Helvetica, sans-serif;
}
#Layer12 {	position:absolute;
	left:133px;
	top:145px;
	width:75px;
	height:15px;
	z-index:105;
}
#Layer40 {	position:absolute;
	left:687px;
	top:556px;
	width:219px;
	height:22px;
	z-index:106;
}
body {
	background-color: #000000;
}
#Layer5 {
	position:absolute;
	left:687px;
	top:583px;
	width:397px;
	height:20px;
	z-index:107;
}
#Layer10 {
	position:absolute;
	left:687px;
	top:610px;
	width:192px;
	height:19px;
	z-index:108;
}
#Layer11 {
	position:absolute;
	left:687px;
	top:637px;
	width:179px;
	height:17px;
	z-index:109;
}
#Layer15 {
	position:absolute;
	left:687px;
	top:665px;
	width:87px;
	height:7px;
	z-index:110;
}
#Layer16 {
	position:absolute;
	left:660px;
	top:884px;
	width:26px;
	height:24px;
	z-index:111;
}
#Layer17 {
	position:absolute;
	left:640px;
	top:495px;
	width:55px;
	height:39px;
	z-index:112;
}
#Layer18 {
	position:absolute;
	left:63px;
	top:252px;
	width:161px;
	height:162px;
	z-index:113;
}
#Layer19 {
	position:absolute;
	left:268px;
	top:660px;
	width:131px;
	height:204px;
	z-index:74;
}
#Layer20 {
	position:absolute;
	left:1121px;
	top:199px;
	width:235px;
	height:11px;
	z-index:113;
}
#Layer21 {
	position:absolute;
	left:637px;
	top:744px;
	width:161px;
	height:17px;
	z-index:113;
}
#Layer22 {
	position:absolute;
	left:641px;
	top:780px;
	width:101px;
	height:89px;
	z-index:114;
}
#Layer25 {
	position:absolute;
	left:756px;
	top:780px;
	width:97px;
	height:88px;
	z-index:115;
}
#Layer26 {
	position:absolute;
	left:870px;
	top:780px;
	width:67px;
	height:63px;
	z-index:116;
}
#Layer31 {
	position:absolute;
	left:985px;
	top:780px;
	width:82px;
	height:81px;
	z-index:117;
}
#Layer32 {
	position:absolute;
	left:774px;
	top:884px;
	width:36px;
	height:20px;
	z-index:118;
}
#Layer33 {
	position:absolute;
	left:888px;
	top:884px;
	width:34px;
	height:13px;
	z-index:119;
}
#Layer34 {
	position:absolute;
	left:1002px;
	top:884px;
	width:31px;
	height:14px;
	z-index:120;
}
-->
</style>

</head>

<body>
<div id="conteneur">
	  <div id="header">header <a
<div id="Layer14" style="position:absolute; left:161px; top:-2px; width:119px; height:87px; z-index:100"><img src="http://www.rnsoul.com/logo2008.jpg" width="180" height="144"alt="" /></div>
<div id="Layer12"><img src="http://www.rnsoul.com/00tete.jpg" width="1280" height="30"alt="" /></div>
</div>
<div id="Layer13" style="position:absolute; left:1119px; top:185px; width:169px; height:123px; z-index:89"><img src="http://www.rnsoul.com/pub.jpg" width="276" height="352" /></div>
<div id="Layer8" style="position:absolute; left:627px; top:25px; width:71px; height:26px; z-index:96">
  <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="728" height="90">
    <param name="movie" value="http://www.rnsoul.com/pub.swf" />
    <param name="quality" value="high" />
    <embed src="http://www.rnsoul.com/pub.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="728" height="90"></embed>
  </object>
</div>




	  <div id="centre">
<div id="Layer53" style="position:absolute; left:152px; top:408px; width:115px; height:15px; z-index:80"><img src="http://www.rnsoul.com/dates.jpg" width="451" height="23"alt="" /></div>
<div id="Layer24" style="position:absolute; left:151px; top:189px; width:117px; height:10px; z-index:82"><img src="http://www.rnsoul.com/actu.jpg" width="451" height="23"alt="" /></div>
<div id="Layer2" style="position:absolute; left:153px; top:628px; width:164px; height:15px; z-index:83"><img src="http://www.rnsoul.com/video.jpg" width="451" height="23"alt="" /></div>
<div id="Layer3" style="position:absolute; left:637px; top:189px; width:122px; height:18px; z-index:84; visibility: visible;"><img src="http://www.rnsoul.com/music.jpg" width="451" height="23"alt="" /></div>
<div id="Layer9" style="position:absolute; left:1154px; top:546px; width:97px; height:0px; z-index:85"><img src="http://www.rnsoul.com/sondage.jpg" width="210" height="23"alt="" /></div>
<div id="Layer46" style="position:absolute; left:636px; top:417px; width:223px; height:306px; z-index:66;">tbn f<img src="http://www.rnsoul.com/top5.jpg" width="455" height="297" /> </div>
<div id="Layer39" style="position:absolute; left:535px; top:325px; width:184px; height:213px; z-index:43; visibility: hidden;">
  <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" name="sondage.swf?id=question1.xml" width="180" height="220" id="sondage.swf?id=question1.xml">
    <param name="movie" value="http://www.rnbnextlevel.com/sondage/sondage.swf?id=question4.xml" />
    <param name="quality" value="high" />
    <embed src="http://www.rnbnextlevel.com/sondage/sondage.swf?id=question4.xml" width="180" height="220" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" name="sondage.swf?id=question1.xml"></embed>
  </object>
</div>
</script>
  <embed src="http://www.radiofg.com/live/bandeaunew.swf" width="160" height="60" type="application/x-shockwave-flash" scale="ShowAll" play="true" loop="True" menu="true" wmode="Window" quality="1"></embed>
</div>
<div id="Layer4" style="position:absolute; left:49px; top:661px; width:414px; height:194px; z-index:51; visibility: hidden;">
  <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="450" height="200">
    <param name="movie" value="http://www.portal-corporation.com/V2player/V2player_napht.swf?playlistXML=http://www.portal-corporation.com/V2player/071026192424494795678.xml" />
    <param name="quality" value="high" />
    <embed src="http://www.portal-corporation.com/V2player/V2player_napht.swf?playlistXML=http://www.portal-corporation.com/V2player/071026192424494795678.xml" width="450" height="200" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" wmode="transparent"></embed>
  </object>
</div>
<div id="Layer1" style="position:absolute; left:638px; top:227px; width:454px; height:176px; z-index:90;">
  <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="450" height="200">
    <param name="movie" value="http://www.portal-corporation.com/V2player/V2player_napht.swf?playlistXML=http://www.portal-corporation.com/V2player/080926214856117062681.xml" />
    <param name="quality" value="high" />
    <embed src="http://www.portal-corporation.com/V2player/V2player_napht.swf?playlistXML=http://www.portal-corporation.com/V2player/080926214856117062681.xml" width="450" height="200" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" wmode="transparent"></embed>
  </object>
</div>
<div id="Layer48" style="position:absolute; left:1170px; top:586px; width:159px; height:181px; z-index:75">
  <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="180" height="220">
    <param name="movie" value="../sondage/sondage.swf?id=question4.xml" />
    <param name="quality" value="high" />
    <embed src="../sondage/sondage.swf?id=question4.xml" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="180" height="220"></embed>
  </object>
</div>  
<div id="Layer40">
  <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="400" height="20">
    <param name="movie" value="http://www.rnsoul.com/top1.swf" />
    <param name="quality" value="high" />
    <embed src="top1.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="400" height="20"></embed>
  </object>
</div>
<div id="Layer5">
  <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="400" height="20">
    <param name="movie" value="http://www.rnsoul.com/top2.swf" />
    <param name="quality" value="high" />
    <embed src="top2.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="400" height="20"></embed>
  </object>
</div>
<div id="Layer10">
  <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="400" height="20">
    <param name="movie" value="http://www.rnsoul.com/top3.swf" />
    <param name="quality" value="high" />
    <embed src="top3.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="400" height="20"></embed>
  </object>
</div>
<div id="Layer17">
  <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="70" height="35">
    <param name="movie" value="http://www.rnsoul.com/top_5.swf" />
    <param name="quality" value="high" />
    <embed src="http://www.rnsoul.com/top_5.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="70" height="35"></embed>
  </object>
<div id="Layer27" style="position:absolute; left:508px; top:163px; width:0px; height:4px; z-index:79"></div>
</div>





  	</div>
	  
	  <div id="pied"></div>
</div>
<div id="Layer45" style="position:absolute; left:174px; top:225px; width:412px; height:126px; z-index:53">
  <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="404" height="170">
    <param name="movie" value="http://www.rnsoul.com/hfqkjq.swf" />
    <param name="quality" value="high" />
    <embed src="http://www.rnsoul.com/hfqkjq.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="404" height="170"></embed>
  </object>
</div>
<div id="Layer23" style="position:absolute; left:169px; top:442px; width:106px; height:24px; z-index:52"><img src="http://www.rnsoul.com/0003.gif" width="418" height="176"alt="" /></div>  
<div id="Layer23" style="position:absolute; left:316px; top:593px; width:128px; height:47px; z-index:52">
  </noscript>
  <marquee class="Scroller" behavior="scroll" direction="left" width="100%" height="19" scrollamount="2" scrolldelay="0" onMouseOver="this.stop()" onMouseOut="this.start()">
  <font size="2" face="Arial, Helvetica, sans-serif"><strong><em></em></strong><font color="#00000"><strong>LES CUIZINES  26/10/07  20:00 - CHELLES ---------- IDA SKRATCH BATTLE 08/12/2007 20:00 - KARKOW, KARKOW / POLAND ---------- ADIDAS PARTY  22/11/2007 20:00 - LYON, LYON ---------- R-ASH + X-ECUTIONERS 	06/12/2007 20:00 - PARIS, Ile-de-France ----------</strong></font></font>
  </marquee>
</div>
<div id="Layer47" style="position:absolute; left:219px; top:682px; width:316px; height:155px; z-index:68;">
  <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="330" height="160">
    <param name="movie" value="http://www.rnsoul.com/video010108.swf" />
    <param name="quality" value="high" />
    <embed src="http://www.rnsoul.com/video010108.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="330" height="160"></embed>
  </object>
</div>
<div id="Layer21"><img src="http://www.rnsoul.com/dl.jpg" width="451" height="23"alt="" /></div>
<div id="Layer22"><img src="http://www.rnsoul.com/album1.png" width="98" height="98"alt="" /></div>
<div id="Layer25"><img src="http://www.rnsoul.com/album1.png" width="98" height="98"alt="" /></div>
<div id="Layer26"><img src="http://www.rnsoul.com/album1.png" width="98" height="98"alt="" /></div>
<div id="Layer31"><img src="http://www.rnsoul.com/album1.png" width="98" height="98"alt="" /></div>
<div id="Layer32"><img src="http://www.rnsoul.com/dl.png" width="65" height="22"alt="" /></div>
<div id="Layer33"><img src="http://www.rnsoul.com/dl.png" width="65" height="22"alt="" /></div>
<div id="Layer34"><img src="http://www.rnsoul.com/dl.png" width="65" height="22"alt="" /></div>
<div id="Layer16"><img src="http://www.rnsoul.com/dl.png" width="65" height="22"alt="" /></div>
<div id="Layer30" style="position:absolute; left:618px; top:917px; width:101px; height:31px; z-index:34"><img src="http://www.rnsoul.com/btline2.gif" width="799" height="40"alt="" /></div>
<div id="Layer36" style="position:absolute; left:417px; top:157px; width:15px; height:4px; z-index:40; visibility: hidden;"><a href="../../../www.rnsoul.com"><img src="http://www.rnbnextlevel.com/DL.gif" width="14" height="14" border="0"alt="" /></a></div>
<div id="Layer37" style="position:absolute; left:344px; top:215px; width:9px; height:11px; z-index:41; visibility: hidden;"><a href="../../../www.rnsoul.com"><img src="http://www.rnbnextlevel.com/DL.gif" width="14" height="14" border="0"alt="" /></a></div>
<div id="Layer38" style="position:absolute; left:460px; top:160px; width:10px; height:5px; z-index:42; visibility: hidden;"><a href="../../../www.rnsoul.com"><img src="http://www.rnbnextlevel.com/DL.gif" width="14" height="14" border="0"alt="" /></a></div>
<div id="Layer28" style="position:absolute; left:115px; top:917px; width:84px; height:29px; z-index:32"><img src="http://www.rnsoul.com/btline2.gif" width="799" height="40"alt="" /></div>
<div id="Layer29" class="style2" style="position:absolute; left:286px; top:897px; width:300px; height:12px; z-index:33">A Propos de | RnSoul  | Nous Contacter</div>
<div id="Layer7" style="position:absolute; left:505px; top:18px; width:0px; height:90px; z-index:95"><img src="file:///E|/Recupe  disque D/wwwrnbnextlevelcom/barG.jpg" width="2" height="94"alt="" /></div>
</div>
</body>
</html>
Bonjour,

capitaine caverne a écrit :
je voudrais savoir si quelqu'un peux me dire
si mon code est faux car je n'arrive pas à resoudre mon probleme
d'adaptation de mon site selon la resolution d'ecran de la personne
qui regarde mon site

Ton code n'est pas faux. C'est juste du code généré avec un éditeur WYSIWYG (à priori Dreamweaver, me trompai-je?), en mode visuel (mode «Création» de Dreamweaver), en créant des «calques» qui sont en fait des DIV positionnées en absolu.

Chaque bloc de contenu est donc un bloc positionné en absolu par rapport aux limites de la page, et dimensionné en pixels (en hauteur et largeur). Cette manière de faire ne tient pas compte:
- des variations de la largeur de la page;
- des variations de la hauteur des contenus (qui dépend de nombreux facteurs).

Ce code n'est donc pas faux; il est simplement mauvais. À jeter si on peut se permettre de recommencer les choses proprement, et si besoin de se former au préalable.
Modifié par Florent V. (10 Oct 2008 - 12:51)
Sujet clos
Aller à