18073 sujets

Questions générales et questions de débutants

Comment faire un site adapté au navigateur [Résolu]

Bonjour à tous

Je suis nouveau sur le forum et je me suis inscrit car j'ai vu de nombreux débutants poser des questions auxquelles ils trouvaient réponses.
Pour ma part, qui suis débutant en "webmastering", j'essaierai d'aider comme je peux ceux qui en auront le besoin.

poUR le moment, j'ai un petit souci avec mon site...
En effet j'aimerai qu'il soit comme la majorité des sites en vogues sur internet, c'est a dire qu'il soit adapté au navigateur.

Par exemple j'ai pu remarqué sur Firefox que quand on étend ou diminue sa barre de favori, les sites internet s'adapte.
Moi lorsque je le fais, j'ai la barre de scroll horizontal qui déboule...

Comment faire comme tous les sites ??
Modifié par kk8ete (29 Sep 2006 - 14:15)
lE SITE : http://netalliance.free.Fr


Le code 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta name="description" content="les pieds sur terre : conseils et solutions originales pour la formation, le coaching et les séminaires.">
<meta name="keywords" content="les pieds sur terre, séminaires, formation, sébastien, Millécamps, sébastien Folin, communication, prise de parole, coaching, améliorer communication, evenementiel, animateur, énergie, oral, entrainement, confiance en soi, communiquer, formation seminaire coaching, anne magnien, andre obadia, catherine blanc, stephanie Heissat, Pierre Marcadé, Anthony Virapin, isabelle sardella">
<meta name="author" content="Sebastien Millécamps, Isabelle Sardella, Anthony Virapin">
<meta name="identifier-url" content="http://lpst.net">
<meta name="revisit-after" content="7 days">
<meta name="classification" content="Education">
<meta name="robots" content="All">
<meta name="distribution" content="Global">
<meta name="rating" content="General">
<meta name="resource-type" content="document">
<meta name="language" content="fr">
<title>Les pieds sur terre</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
.unnamed1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	color: #FFFFFF;
	text-align: left;
	vertical-align: baseline;
	top: auto;
}
.titrre {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	color: #CC9900;
	font-weight: normal;
}
body {
	background-color: #333366;
}
.Style1 {
	font-family: Arial, Helvetica, sans-serif;
	color: #FFFFFF;
	font-size: 14px;
}
.Style4 {color: #FFFFFF}
.Style9 {font-family: Arial, Helvetica, sans-serif}
.Style16 {color: #33FFFF; font-weight: bold; }
.Style18 {color: #CC9900; font-family: Arial, Helvetica, sans-serif; font-size: 14px;}
.Style24 {
	font-style: normal;
	font-size: 18px;
	color: #ff9900;
	font-weight: bold;
}
.Style26 {font-style: normal; font-size: 18; color: #ff9900; font-weight: bold; }
.Style27 {
	font-size: 24px;
	color: #CCCCCC;
}
.Style30 {font-size: 12px}
.Style31 {font-size: 12px}
.Style32 {
	color: #FF9900;
	font-weight: bold;
}
.Style33 {font-style: normal; color: #CC9900; font-weight: normal; font-family: Arial, Helvetica, sans-serif;}
.liens {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	font-weight: bold;
	font-variant: normal;
	color: #FFFFFF;
	cursor: hand;
	text-decoration: none;
}
a:link {
	text-decoration: none;
}
a:visited {
	text-decoration: none;
}
a:hover {
	text-decoration: none;
}
a:active {
	text-decoration: none;
}
.liensinternes {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	text-decoration: underline;
}
.copiright {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9px;
	font-style: normal;
	color: #FFFFFF;
}
-->
</style>
<script type="text/JavaScript">
<!--



function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
//-->
</script>
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_reloadPage(init) {  //reloads the window if Nav4 resized
  if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
    document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
  else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
//-->
</script>
<link href="lien.css" rel="stylesheet" type="text/css">
</head>

<body bgcolor="#333366" link="#FFFFFF" vlink="#FFFFFF" alink="#FFFFFF">
<table width="100%" border="0">
  <tr>
    <td><table width="800" height="600" border="1" align="center" cellpadding="0" cellspacing="0" bgcolor="#333366" frame="border">
      <tr bgcolor="#333366">
        <td height="202" colspan="3">
          <div align="left">
            <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="889" height="200">
                <param name="movie" value="headerclasse5.swf">
                <param name="quality" value="high">
                <embed src="headerclasse5.swf" width="889" height="200" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash"></embed>
              </object>
          </div></td>
      </tr>
      <tr bgcolor="#333366">
        <td height="46" colspan="3"><table width="821" border="0">
            <tr>
              <td width="10"> </td>
              <td width="106" height="40">
                <p align="left" class="Style1"><a href="seminaires.htm"><strong><font size="-1">SEMINAIRES<br>
              DE FORMATION</font></strong></a><strong><u> </u></strong></p>
              </td>
              <td width="5"> </td>
              <td width="108" class="Style1"><a href="coaching.htm"><strong><font size="-1">COACHING
                      ET TEAM BUILDING</font></strong></a></td>
              <td width="5"> </td>
              <td width="58"><div align="left"><strong><font color="#FFFFFF" size="-1" face="Arial, Helvetica, sans-serif"><a href="conseil.htm">CONSEIL</a></font></strong></div>
              </td>
              <td width="5"><div align="center"></div>
              </td>
              <td width="107"><div align="left"><strong><font color="#FFFFFF" size="-1" face="Arial, Helvetica, sans-serif"><a href="evenementiels.htm">EVENEMENTIELS</a></font></strong></div>
              </td>
              <td width="5" class="Style1"><div align="center"></div>
              </td>
              <td width="88" class="Style1"><div align="left"><strong><font color="#FFFFFF" size="-1" face="Arial, Helvetica, sans-serif"><a href="REFERENCES.htm">REFERENCES</a></font></strong></div>
              </td>
              <td width="5"><div align="center"></div>
              </td>
              <td width="44"><div align="left"><strong><font color="#FFFFFF" size="-1" face="Arial, Helvetica, sans-serif"><a href="lieux.htm">LIEUX</a></font></strong></div>
              </td>
              <td width="5" class="Style1">  </td>
              <td width="52" class="Style1"><font size="-1"><strong><a href="pageequipe.html">EQUIPE</a></strong></font></td>
              <td width="10" class="Style1"> </td>
              <td width="81" class="Style1"><font size="-1"><strong><a href="contacts.htm">CONTACTS</a></strong></font></td>
              <td width="9" class="Style1"> </td>
              <td width="44" class="Style1"><div align="left"><font size="-1" face="Arial, Helvetica, sans-serif"><a href="index.htm"><img src="images/picto_maison5.jpg" width="30" height="30" border="0"></a> </font></div>
              </td>
            </tr>
          </table>
        </td>
      </tr>
      <tr class="unnamed1">
        <td height="245" align="center" valign="top
	" bgcolor="#333366">
          <div align="left">            <table border="0">
              <tr>
                <td><div align="left"><span class="Style27"> Témoignages</span><br>
                      <br>
                      <span class="Style24">   Les pieds sur terre<br>
  par Sébastien Folin</span> </div>
                  <p align="left"><img src="images/SEBFOLIN.jpg" alt="Sebastien Folin" width="72" height="95" align="left"><em><font color="#FFFFFF" size="-1">« J’ai
                        longtemps été sceptique face à ces
                        offres de coaching d’animateurs qui pullulent depuis <br>
  4 ou 5 ans.<br>
  Cela fait 15 ans que je fais de la télé alors qui va m’apprendre à parler
  face caméra ? »</font></em><u><br>
          <br>
          </u><a href="seb.htm"><span class="liensinternes">> <u>Lire l'intégralité du
          texte</u></span></a><span class="liensinternes"><br>
                <a href="temoignages.htm"><u>> Visionner d'autres témoignages
                (interviews)</u></a></span></p></td>
              </tr>
            </table>
            </div>
          </td>
        <td width="54%" rowspan="4" align="left" valign="top"><blockquote> 
          <table border="0">
            <tr>
              <td><font face="Arial, Helvetica, sans-serif"><span class="Style27"><font color="#CCCCCC">Nos
                      savoirs faire</font></span><br>
                  <font color="#00FFFF"><br>
                  <span class="Style24"><font color="#99FF00"><a href="seminaires.htm"><font color="#FF9900">Séminaires
                  de formation</font></a></font></span></font></font><span class="Style30"><br>
                        <br>
                        </span><span class="Style1">• Communication personnelle<br>
                        <em>image et image de soi, prise de la parole et argumentation
                        en public, média training </em><br>
• Performance par l'énergie<br>
<em>ateliers énergétiques, séminaires 100% énergie,
bien être et massages </em><br>
• Formations sur mesure pour les professionnels de l'audiovisuel</span><br>
<font color="#CC9900"><br>
</font> <span class="Style26"><a href="coaching.htm"><font color="#FF9900">Coaching
et Team building à problématique professionnelle</font></a><br>
</span><br>
<span class="Style1">• Panorama de nos domaines d’intervention <br>
• Team Building, coaching d’équipe <br>
• Trois exemples de programmes individuels</span><a href="coaching.htm"><span class="Style30"><br>
</span></a><span class="Style30"><br>
</span><font face="Arial, Helvetica, sans-serif"><font color="#00FFFF"><span class="Style24"><font color="#99FF00"><a href="conseil.htm"><font color="#FF9900">Conseil</font></a></font></span></font></font><br>
<br>
<span class="Style1">• Stratégie et organisation<br>
• Communication<br>
• Créativité</span><span class="Style30"><br>
</span><font size="+1"><span class="titrre"><br class="Style1">
</span></font><font face="Arial, Helvetica, sans-serif"><font color="#00FFFF"><span class="Style24"><font color="#99FF00"><a href="evenementiels.htm"><font color="#FF9900">Evènementiels</font></a></font></span></font></font><span class="unnamed1"><br>
<span class="Style31"><br>
</span></span><span class="Style1">• Conception<br>
• Animation<br>
• Production d’évènementiels </span><span class="unnamed1"><span class="liensinternes"></span></span></td>
            </tr>
          </table>
          <span class="unnamed1"><span class="liensinternes"><br>
      </span></span></blockquote>
        </td>
        <td width="25%" rowspan="4" valign="top"><table border="0">
          <tr>
            <td><span class="Style27"><font face="Arial, Helvetica, sans-serif"> L'équipe</font></span></td>
          </tr>
        </table>
          <p align="left"><font face="Arial, Helvetica, sans-serif"><span class="Style24"> </span></font></p>
          <table border="0">
            <tr>
              <td><font color="#FFFFFF" size="-1">
                <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="217" height="163" hspace="0" vspace="0">
                  <param name="movie" value="photoequipe.swf">
                  <param name="quality" value="high">
                  <embed src="photoequipe.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="217" height="163"></embed>
                </object>
              </font></td>
            </tr>
          </table>
          <table border="0">
            <tr>
              <td><div align="left"><font color="#FFFFFF" size="-1">Notre équipe
                    est constituée
                            de professionnels indépendants, spécialistes
                            de la communication <br>
                    et de la relation
                            d'aide qui se sont rassemblés et choisis par
                            estime réciproque et complémentarité de
                            compétences à l'initiative
                            et autour<br>
                de Sebastien Millécamps (photo ci-dessous)</font></div></td>
            </tr>
          </table>
          <table border="0">
            <tr>
              <td><a href="sebmill.html" target="_blank" class="Style4"><u></u></a><a href="sebmill.html"><img src="images/NV2.JPG" width="160" height="125" border="0"></a></td>
            </tr>
          </table>
          <p align="left"><font color="#FFFFFF" size="-1">            </font></p>
          <div align="left"> <a href="sebmill.html" target="_blank" class="Style4"><u></u></a>
            <table border="0">
              <tr>
                <td><span class="liensinternes"><a href="pageequipe.html" target="_blank" class="Style4"><u><font color="#666666"><font color="#FFFFFF">> Qui
                            sommes nous ?</font></font></u></a><a href="Principe%20d%E9onthologique.htm" target="_blank" class="Style4"><u><font color="#666666"><font color="#FFFFFF"><br>
> Nos principes déontologiques</font></font></u></a></span></td>
              </tr>
            </table>
            <br>
              <br>
            </div>
        </td>
      </tr>
      <tr class="unnamed1">
        <td height="144" align="center" valign="top
	" bgcolor="#333366"><table border="0">
          <tr>
            <td><div align="center">
              <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="158" height="139">
                  <param name="movie" value="images/BLOG.swf">
                  <param name="quality" value="high">
                  <embed src="images/BLOG.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="158" height="139"></embed>
              </object>
            </div></td>
          </tr>
        </table>
        </td>
      </tr>
      <tr class="unnamed1">
        <td align="center" valign="top
	" bgcolor="#333366"><div align="left">
          <table width="100%" border="0">
            <tr>
              <td height="177"><div align="left"><span class="unnamed1"><a href="conviction.htm" target="_blank"><img src="Diapositive1.JPG" alt="conviction" width="190" height="142" border="0"></a></span><span class="liensinternes"><a href="conviction.htm" target="_blank"><u><br>>                
                
                Cliquez
                  pour découvrir la présentation</u></a></span><span class="unnamed1"></span></div></td>
            </tr>
          </table>
          </div>
        </td>
      </tr>
      <tr class="unnamed1">
        <td width="21%" align="center" valign="top
	" bgcolor="#333366"><div align="left">
            <table width="100%" border="0">
              <tr>
                <td><span class="Style24">  Bulletin d'inscription</span><u><br>
                </u><br>
                <span class="Style1"><a href="images/formulaire2.pdf" target="_blank"><u>> Télécharger
                un modèle de bulletin à compléter et à nous
                retourner.</u></a></span></td>
              </tr>
            </table>
            <p><span class="Style24">  </span><a href="images/formulaire2.pdf" target="_blank"><u><br>
            </u></a></p>
          </div>
        </td>
      </tr>
    </table></td>
  </tr>
</table>
<div align="center">
  <p class="copiright"><font color="#FFFFFF">Isabelle Sardella
        / Anthony Virapin / Sébastien Millécamps <br>
    Les pieds sur terre 2006, tous droits réservés. </font></p>
</div>
</body>
</html>
[/i][/i]
Merci mais j'ai déja lu cetutoriel; et mon site est en effet dans un conteneur de 100 %, et j'ai essayé de changé d'unité pour tous les éléments a part le cadre central que j'ai définit en 800x600 px
Administrateur
kk8ete a écrit :
a part le cadre central que j'ai définit en 800x600 px

Donc il est normal que celui-ci ne s'adapte pas à d'autres largeurs, n'est-ce pas ?
Résolu, j'aimerai bien...

j'ai reussi a faire ce que je voulais mais sous Opera, ca ne passe pas...
tout est décalé..
Oui c'est vrai que c'est un navigateur ... spécial

Bon ben si quelq'un me trouve une solution, je suis preneur !
en tout cas merci pour votre aide, et vos réponses, j'avais demandé sur d'autres forums... et... bon sans commentaires ! ca risque de m'énerver !!
Sujet clos
Aller à