18008 sujets

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

Problème d'affichage

bonjour
j'ai utiliser le tuto d'alsacreation "réalisation d'un designe en 5 étape".

j'ai adapter cela à mon contenu par je rencontre un petit soucis..
dans le div#contenu j'ai ajouter un autre div histoire de pouvoir ajouter un menu vertical.
j'ai un souci avec cet div, si je ne fais pas une série de </br> histoire d'agrandir (avec les éspaces) le div#contenu pour que ma div#zone soit pas hors cadre.


		div#zone {
	float:left;
	width:161px;
	height:400px;
	font-family: "Times New Roman", Times, serif;
	} 
                		div#contenu
		{
	padding: 0 25px 0 165px;
	background-repeat: no-repeat;
	background-position: 15px 15px;
	position: static;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 13px;
		}

voici le code css,



<!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" />

<link href="CSS/Tram page web.css" rel="stylesheet" type="text/css" />
<link href="CSS/Menu déroulant pumaworld.css" rel="stylesheet" type="text/css" />
<link href="CSS/menu non déroulant.css" rel="stylesheet" type="text/css" />

<title>Acceuil de pumaworld</title>
<SCRIPT LANGUAGE="JavaScript">
function HeureCheck()
{
krucial = new Date;
heure = krucial.getHours();
min = krucial.getMinutes();
sec = krucial.getSeconds();
jour = krucial.getDate();
mois = krucial.getMonth()+1;
annee = krucial.getFullYear();
if (sec < 10)
{
sec0 = "0";
}
else
{
sec0 = "";
}
if (min < 10)
{
min0 = "0";
}
else
{
min0 = "";
}
if (heure < 10)
{
heure0 = "0";
}
else
{
heure0 = "";
}
if (mois < 10)
{
mois0 = "0";
}
else
{
mois0 = "";
}
if (jour < 10)
{
jour0 = "0";
}
else
{
jour0 = "";
}
if (annee < 10)
{
annee0 = "0";
}
else
{
annee0 = "";
}
DinaDate = "" + jour0 + jour + "/" +  mois0 + mois + "/" + annee0 + annee;
total = DinaDate
DinaHeure = heure0 + heure + ":" + min0 + min + ":" + sec0 + sec;
total = DinaHeure
total = DinaDate + " - " + DinaHeure;
document.time.timebox.value = total;
tempo = setTimeout("HeureCheck()", 1000)
}
window.onload = HeureCheck;
</script>
<!--
  jQuery library
-->
<script type="text/javascript" src="jcarousel/lib/jquery-1.2.3.pack.js"></script>
<!--
  jCarousel library
-->
<script type="text/javascript" src="jcarousel/lib/jquery.jcarousel.pack.js"></script>
<!--
  jCarousel core stylesheet
-->
<link rel="stylesheet" type="text/css" href="jcarousel/lib/jquery.jcarousel.css" />
<!--
  jCarousel skin stylesheet
-->
<link rel="stylesheet" type="text/css" href="jcarousel/skins/tango/skin1.css" />

<script type="text/javascript">

function mycarousel_initCallback(carousel)
{
    // Disable autoscrolling if the user clicks the prev or next button.
    carousel.buttonNext.bind('click', function() {
        carousel.startAuto(0);
    });

    carousel.buttonPrev.bind('click', function() {
        carousel.startAuto(0);
    });

    // Pause autoscrolling if the user moves with the cursor over the clip.
    carousel.clip.hover(function() {
        carousel.stopAuto();
    }, function() {
        carousel.startAuto();
    });
};

jQuery(document).ready(function() {
    jQuery('#mycarousel').jcarousel({
        auto: 2,
        wrap: 'last',
        initCallback: mycarousel_initCallback
    });
});

</script>
<style type="text/css">
<!--
.style1 {color: #FFFFFF}
.style2 {
	color: #FF0000;
	font-weight: bold;
}
.style3 {color: #FF0000}
-->
</style>
<script src="Scripts/AC_ActiveX.js" type="text/javascript"></script>
<script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
</head>
<body><script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
try {
var pageTracker = _gat._getTracker("UA-7788707-1");
pageTracker._trackPageview();
} catch(err) {}</script>
<a name="haut" id="haut">&nbsp;</a>
	<div id="conteneur">		
	  <h1 id="header"><a href="file:///E|/MES DOCUMENTS/PUMA/Pumaworld v2.0/etape5.html" title="Colored Design - Accueil"><span>Colored Design</span></a></h1>
<div id="nav">
<li><a href="index.html" title="aller à la section 1"><strong>ACCUEIL</strong></a></li>
	<li><a href="http://www.pumafrance.fr/forum" title="aller à la section 2" ><strong>FORUM</strong></a></li>
	<li><a href="Tuning.html" title="aller à la section 3"><strong>TUNING</strong><span class="style2">(new)</span></a></li>
    <li><a href="les meeting.html" title="aller à la section 4"><strong>MEETING </strong><span class="style2">(new)</span></a></li>
	<li><a href="Partenaire.html" title="aller à la section 5"><strong>PARTENAIRE</strong></a></li>
    <li><a href="Pumastore.html" title="aller à la section 6"><strong>PUMASTORE</strong><span class="style2">(new)</span></a></li>  
	<li><a href="Lexique.html" title="aller à la section 7"><strong>WIKI-PUMA</strong></a></li>  
</div>
<form action="http://www.google.fr/recherche/" name="time" id="cse-search-box">
                        <input type="hidden" name="cx" value="partner-pub-0795174221178624:134yfq-im4s" />
                        <input type="text" name="q" size="19" id="google"/>
                        <input type="image" name="sa" src="Image/ok.gif" value="OK" />
                        <span class="style1">
                        <script type="text/javascript" src="http://www.google.com/coop/cse/brand?form=cse-search-box&amp;lang=fr"></script>
                        Date et heure du jour:</span>
                        <span class="style1">
                        <INPUT TYPE="text" NAME="timebox" SIZE=19/>
    </span>
<noscript><a href="http://www.editeurjavascript.com/countus/">compteur live</a></noscript>

</form>
<div id="zone">
  <div id="menu_dynamique">
    <ul>
      <li class="extend"> <a href="#">La Puma</a>
          <ul>
            <li class="end"> <a href="Pr&eacute;sentation Puma.html">Pr&eacute;sentation</a> </li>
          </ul>
        <ul>
            <li class="end"> <a href="Les mod&egrave;les de Puma.html">Les mod&egrave;les</a> </li>
        </ul>
        <ul>
            <li class="end"> <a href="Les finitions.html">Les finitions</a></li>
        </ul>
      </li>
      <li class="extend"> <a href="#">Entretenir une Puma</a>
          <ul>
            <li class="end"> <a href="L'entretien G.html">Entretien g&eacute;n&eacute;ral</a> </li>
          </ul>
        <ul>
            <li class="end"> <a href="aide et d&eacute;pannage.html">Aide et d&eacute;pannage</a></li>
        </ul>
        <ul>
            <li class="end"> <a href="R&eacute;f&eacute;rence util.html">R&eacute;f&eacute;rences utiles</a> </li>
        </ul>
      </li>
      <li class="extend"> <a href="#">Guide pratique</a>
          <ul>
            <li class="end"> <a href="Les assurances.html">Assurer une Puma</a> </li>
          </ul>
        <ul>
            <li class="end"> <a href="puma &agrave; l'argus.html">La Puma cot&eacute; argus</a> </li>
        </ul>
        <ul>
            <li class="end"> <a href="le contr&ocirc;le technique.html">Le contr&ocirc;le technique<span class="style2"> (new)</span></a> </li>
        </ul>
        <ul>
            <li class="end"> <a href="Tarif pi&egrave;ces.html">Tarifs des pi&egrave;ces</a> </li>
        </ul>
        <ul>
            <li class="end"> <a href="Tuning_la reglementation.html">Tuning-la reglementation</a></li>
        </ul>
      </li>
      <li class="extend"> <a href="#">Les pumistes</a>
          <ul>
            <li class="end"> <a href="localiser un pumiste.html">Localiser un pumiste</a> </li>
          </ul>
        <ul>
            <li class="end"> <a href="Puma des membres.html">Les Puma des membres</a></li>
        </ul>
      </li>
      <li class="extend"><a href="Multim&eacute;dia.html">Bonus<span class="style2"> (new)</span></a>
          <ul>
            <li class="end"> <a href="localiser un pumiste.html">Concours Pumaworld</a> </li>
          </ul>
        <ul>
            <li class="end"> <a href="les vid&eacute;os.html">Vid&eacute;oth&egrave;que de Pumaworld</a> </li>
        </ul>
        <ul>
            <li class="end"> <a href="les photos.html">Album photo Pumaworld</a></li>
        </ul>
        <ul>
            <li class="end"> <a href="Calendrier Puma.html">Calendrier Pumaworld</a> </li>
        </ul>
        <ul>
            <li class="end"> <a href="Les sondages.html">Sondages Pumaworld</a> </li>
        </ul>
        <ul>
            <li class="end"> <a href="La puma et les jeux vid&eacute;o.html">La Puma et les jeux vid&eacute;o</a> </li>
        </ul>
        <ul>
            <li class="end"> <a href="Fond d'&eacute;cran.html">Fond d'&eacute;cran</a> </li>
        </ul>
      </li>
      <li class="end"><a href="T&eacute;l&eacute;charger.html">T&eacute;l&eacute;charger</a></li>
      <li class="end last"><a href="Me contacter.html">Nous contacter</a></li>
    </ul>
  </div>
  <p align="center">
    <?
// DEBUT DU CODE COUNTUS
if(!empty($_SERVER["HTTP_X_FORWARDED_FOR"])) $countus_ip = $_SERVER["HTTP_X_FORWARDED_FOR"];
else $countus_ip = $_SERVER["REMOTE_ADDR"];
if(!empty($_SERVER["HTTP_HOST"]) && !empty($_SERVER["REQUEST_URI"])) $countus_page = urlencode($_SERVER["HTTP_HOST"].$_SERVER["REQUEST_URI"]);
else $countus_page = "none";
if(!@readfile("http://countus1.editeurjavascript.com/countus.php?pseudo=puma&present=3&color=%23000000&textcolor=%23CCFF66&ip=$countus_ip&page=$countus_page&timer=".time()))
	echo "CountUs indisponible";
// FIN DU CODE COUNTUS
?>
    <!-- DEBUT DU CODE COUNTUS -->
    <a href="http://www.countus.fr/" class="mainLinkCSOnline">compteur gratuit</a>
    <script type="text/javascript">
<!--
today = new Date;
sec = today.getTime();
document.write('<scr'+'ipt type="text/javascript" src="http://countus1.editeurjavascript.com/countus.php3?pseudo=puma&timer=')
document.write(sec)
document.write('&present=3&color=%23000000&textcolor=%23CCFF66"><\/scr'+'ipt>')
//-->
</script>
    <!-- FIN DU CODE COUNTUS -->
  </p>
  <p>
    <script type="text/javascript">
AC_FL_RunContent( 'type','application/x-shockwave-flash','width','160','height','120','data','player.swf','movie','player','flashvars','file=Pub-puma.flv' ); //end AC code
</script>
    <noscript>
      <object type="application/x-shockwave-flash" width="160" height="120" data="player.swf">
        <param name="movie" value="player.swf" />
        <param name="flashvars" value="file=Pub-puma.flv" />
      </object>
      </noscript>
  </p>
  <p><u><strong>SONDAGE </strong></u>
      <!-- PourOuContre.com Debut du code HTML -->
    : </p>
  <form action="http://www.pouroucontre.com/cgi-file/vote1.cgi" method="post">
    <input type="hidden" name="num" value="68196" />
    <table border="0" width="160" cellpadding="3" cellspacing="0">
      <tr>
        <td align="center" bgcolor="#006600"><font face="Arial,Helvetica" size="2" color="#ffffff"><b>Comment avez vous connu Pumaworld?</b></font></td>
      </tr>
      <tr>
        <td bgcolor="#ccffcc"><font face="Arial,Helvetica" size="2" color="#000000">
          <input type="radio" name="c1" value="1" checked="checked" />
          Moteur de recherche (Google,..)<br />
          <input type="radio" name="c1" value="2" />
          Sur Pumafrance<br />
          <input type="radio" name="c1" value="3" />
          Sur Pumapeople<br />
          <input type="radio" name="c1" value="4" />
          Sur pum'attitude<br />
          <input type="radio" name="c1" value="5" />
          Autre</font> </td>
      </tr>
      <tr>
        <td align="center" bgcolor="#ccffcc"><input type="submit" value="Voter" />
            <br />
            <font face="Arial,Helvetica" size="2" color="#000000"><a href="http://www.pouroucontre.com/cgi-file/result.cgi?num=68196">R&eacute;sultats</a></font></td>
      </tr>
    </table>
  </form>
  <!-- PourOuContre.com Fin du code HTML -->
  </p>
</div>
<div id="contenu">

<div id="defile"></div>
  </div>
<p id="footer">&nbsp;</p>
      <br />

	</div>
</body>
</html>

voici le script
Sujet clos
Aller à