Création d'un site internet débutant

Résolu/Fermé
karikikou Messages postés 84 Date d'inscription dimanche 7 décembre 2008 Statut Membre Dernière intervention 6 juillet 2011 - 7 déc. 2008 à 19:36
karikikou Messages postés 84 Date d'inscription dimanche 7 décembre 2008 Statut Membre Dernière intervention 6 juillet 2011 - 9 déc. 2008 à 21:23
Bonjour,
Je compte beaucoup sur la communauté pour m'aider à créer un site car il représente un reel projet pour moi dans le futur. ous imaginez bien que j'aurai plusieurs problèmes et le 1er qui m'embete le plus c'est la taille de l'image par rapport à la résolution de l'internaute.. Je ne sais pas du tout comment faire.
MERCI POUR VOTRE AIDE CAR J'EN AI VRAIMENT BESOIN EN URGENCE

Je travaille sur Dreamweaver CS3 et j'ai créé une page test ci dessous par exemple...



<head>
<!-- Copyright 2005 Macromedia, Inc. All rights reserved. -->
<title>Introduction</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="mm_travel2.css" type="text/css" />
<script language="JavaScript" type="text/javascript">
//--------------- LOCALIZEABLE GLOBALS---------------
var d=new Date();
monthname= new Array("Janvier","Février","Mars","Avril","Mai","Juin","Juillet","Août","Septembre","Octobre","Novembre","Décembre");
//Ensure correct for language. English is "January 1, 2004"
var TODAY = monthname[d.getMonth()] + " " + d.getDate() + ", " + d.getFullYear();
//--------------- END LOCALIZEABLE ---------------
</script>
<style type="text/css">
<!--
#apDiv1 {
position:absolute;
width:200px;
height:115px;
z-index:1;
}
#apDiv2 {
position:absolute;
width:502px;
height:127px;
z-index:2;
left: 451px;
top: 1px;
}
#apDiv3 {
position:absolute;
width:167px;
height:115px;
z-index:2;
left: 0px;
top: 484px;
}
#apDiv4 {
position:absolute;
width:446px;
height:130px;
z-index:2;
left: 453px;
top: -3px;
background-color: #3366CC;
}
#apDiv5 {
position:absolute;
left:382px;
top:153px;
width:401px;
height:401px;
z-index:1;
}
#apDiv6 {
position:absolute;
left:399px;
top:9px;
width:503px;
height:73px;
z-index:2;
background-color: #33FF33;
}
#apDiv7 {
position:absolute;
left:903px;
top:504px;
width:181px;
height:95px;
z-index:2;
}
#apDiv8 {
position:absolute;
left:907px;
top:510px;
width:38px;
height:27px;
z-index:3;
}
#apDiv9 {
position:absolute;
left:906px;
top:558px;
width:54px;
height:43px;
z-index:3;
}
#apDiv10 {
position:absolute;
left:946px;
top:535px;
width:0px;
height:1px;
z-index:4;
}
#apDiv11 {
position:absolute;
left:904px;
top:504px;
width:51px;
height:26px;
z-index:4;
}
#apDiv12 {
position:absolute;
left:902px;
top:502px;
width:176px;
height:29px;
z-index:2;
}
#apDiv13 {
position:absolute;
left:901px;
top:452px;
width:176px;
height:21px;
z-index:3;
}
#apDiv14 {
position:absolute;
left:853px;
top:200px;
width:254px;
height:91px;
z-index:4;
}
.Style16 {font-size: larger; }
.Style17 {font-size: large}
.Style8 {font-family: Arial, Helvetica, sans-serif;
font-size: 16px;
font-weight: bold;
}
.Style9 {font-family: Arial, Helvetica, sans-serif; font-size: 10px; font-weight: bold; }
#apDiv15 {
position:absolute;
left:54px;
top:266px;
width:247px;
height:213px;
z-index:5;
}
-->
</style>
</head>
<body bgcolor="#C0DFFD">
<div id="apDiv5"><img src="/Site/images/Logo webtransit.jpg" alt="" name="INTRO" width="400" height="400" id="INTRO" /></div>
<div id="apDiv12"><a href="Page en construction.html"><img src="/Site/images/drapeau England.jpg" width="30" height="20" alt="" /> English version</a></div>
<div id="apDiv13"><a href="Page d'accueil WEBTRANSIT.php"><img src="/Site/images/drapeau france.jpg" width="30" height="20" alt="" /> Version française</a></div>
<div id="apDiv14">
<p align="center" class="Style16"><strong>POUR ACCEDER AU SITE, CHOISIR LA LANGUE</strong></p>
<p align="center" class="Style16"> </p>
<p align="center" class="Style16"><strong>TO GO TO THE SITE, CHOOSE YOUR LANGUAGE</strong></p>
</div>
<div id="apDiv15">
<table width="94%" height="69" border="0">
<tr>
<td><p align="center" class="Style8">Espace Client:</p>
<form id="form2" name="form2" method="post" action="mailto:postmaster@web-transit.com">
<label>User
<input type="text" name="User" id="User" />
</label>
</form>
<form id="form3" name="form3" method="post" action="">
<label>Password
<input type="password" name="Password" id="Password" />
</label>
</form>
<form id="form1" name="form1" method="post" action="mailto:postmaster@web-transit.com">

<div align="left">
<input type="submit" name="OK" id="OK" value="OK" />
</div>
</form>
<p class="Style9"><a href="mailto:postmaster@web-transit.com">Vous avez oublié votre mot de passe?</a></p></td>
</tr>
</table>
</div>
<table width="1170" height="734">
<tr>
<th width="341" height="118" bgcolor="#3366CC" scope="col"><script language="JavaScript" type="text/javascript">
document.write(TODAY); </script> </th>
<th width="475" bgcolor="#3366CC" scope="col"><span class="Style17">WWW.WEB-TRANSIT.COM</span></th>
<th width="338" bgcolor="#3366CC" scope="col"> </th>
</tr>
<tr>
<td height="484"> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td><p align="center"><a href="mailto:postmaster@web-transit.com">Contact Webmaster</a> • <a href="mentions legales.php">Mentions Légales</a></p>
<p align="center" style="font-size: 0.8em;">©2008 - TOUT DROITS RESERVES - - WEB-TRANSIT.COM</p></td>
<td> </td>
</tr>
</table>
</body>
</html>
A voir également:

16 réponses

alexthekiller Messages postés 82 Date d'inscription dimanche 7 décembre 2008 Statut Membre Dernière intervention 24 janvier 2013 8
7 déc. 2008 à 22:29
Il suffit d'appliquer une largeur relative (=qui change selon la taille de la fenêtre et de l'écran du visiteur) à la page.

Le plus courant est d'utiliser la balise body.
A vous d'adapter si vous utilisez un div#corps ou autre.

Pour adapter la taille de la page, il faut utiliser ce code CSS :

body{width:100%;}


Avec ce code la page prendra 100% de la fenêtre, quelle que soit sa taille.

On peut évidemment définir la largeur que l'on veut (90%, 80%, etc.)

Si l'on définit une plus petite largeur, on peut centrer avec "margin:auto".
0
karikikou Messages postés 84 Date d'inscription dimanche 7 décembre 2008 Statut Membre Dernière intervention 6 juillet 2011 1
7 déc. 2008 à 23:08
Merci beaucoup pour votre aide... je suis vraiment débutant et je ne voudrait pas faire un bug en mettant les code n'importe ou. pourriez vous me dire dans mon exemple ou placer le code body pour mettre la largeur adéquate et le code margin auto pour center SVP.

Merci d'avance pour votre aide primoridale pour moi

Chris
0
alexthekiller Messages postés 82 Date d'inscription dimanche 7 décembre 2008 Statut Membre Dernière intervention 24 janvier 2013 8
7 déc. 2008 à 23:18
http://css.alsacreations.com/Faire-une-mise-en-page-sans-tableaux/Centrer-les-elements-ou-un-site-web-en-CSS
ta le tutorial sur se site la sa peu t'aidé jspr
0
karikikou Messages postés 84 Date d'inscription dimanche 7 décembre 2008 Statut Membre Dernière intervention 6 juillet 2011 1
7 déc. 2008 à 23:24
merci c'est cool mais le truc c'est que je ne sais pas ou placer ces codes dans ma page....? Si j'ai l'exemple pour un, après ca sera easy.

merci en tout cas pour l'aide
0

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

Posez votre question
alexthekiller Messages postés 82 Date d'inscription dimanche 7 décembre 2008 Statut Membre Dernière intervention 24 janvier 2013 8
7 déc. 2008 à 23:33
http://www.free-css-templates.com/

ici tu peu télécharger les templat et tu peu regardé comment il sont fait et voila et puis
tu peu modifier
voila jspr que je tes doné des meilleur idée et bonne chance pour ton site
0
karikikou Messages postés 84 Date d'inscription dimanche 7 décembre 2008 Statut Membre Dernière intervention 6 juillet 2011 1
8 déc. 2008 à 00:01
Merci j'ai compris ou placer le code CSS #global... ça commence à rentrer lol merci

par contre, j'ai fait plusieur test mais je ne sais pas ou placer le code

<div id="global"></div> dans le code precedent. pouvez vous me dire comment vous le placeriez???? merci encore
Chris
0
karikikou Messages postés 84 Date d'inscription dimanche 7 décembre 2008 Statut Membre Dernière intervention 6 juillet 2011 1
8 déc. 2008 à 00:21
Haaaaaaaaaaaa j'y arrive po :-( merci d'avance à tout les webmaster qui me diront ou placer le code <div id="global"></div>

dans le codage suivant SVP...... merci ca m'aiderait beaucoup



<?php
if (!isset($_SESSION)) {
session_start();
}
$MM_authorizedUsers = "";
$MM_donotCheckaccess = "true";

// *** Restrict Access To Page: Grant or deny access to this page
function isAuthorized($strUsers, $strGroups, $UserName, $UserGroup) {
// For security, start by assuming the visitor is NOT authorized.
$isValid = False;

// When a visitor has logged into this site, the Session variable MM_Username set equal to their username.
// Therefore, we know that a user is NOT logged in if that Session variable is blank.
if (!empty($UserName)) {
// Besides being logged in, you may restrict access to only certain users based on an ID established when they login.
// Parse the strings into arrays.
$arrUsers = Explode(",", $strUsers);
$arrGroups = Explode(",", $strGroups);
if (in_array($UserName, $arrUsers)) {
$isValid = true;
}
// Or, you may restrict access to only certain users based on their username.
if (in_array($UserGroup, $arrGroups)) {
$isValid = true;
}
if (($strUsers == "") && true) {
$isValid = true;
}
}
return $isValid;
}

$MM_restrictGoTo = "erreur.php";
if (!((isset($_SESSION['MM_Username'])) && (isAuthorized("",$MM_authorizedUsers, $_SESSION['MM_Username'], $_SESSION['MM_UserGroup'])))) {
$MM_qsChar = "?";
$MM_referrer = $_SERVER['PHP_SELF'];
if (strpos($MM_restrictGoTo, "?")) $MM_qsChar = "&";
if (isset($QUERY_STRING) && strlen($QUERY_STRING) > 0)
$MM_referrer .= "?" . $QUERY_STRING;
$MM_restrictGoTo = $MM_restrictGoTo. $MM_qsChar . "accesscheck=" . urlencode($MM_referrer);
header("Location: ". $MM_restrictGoTo);
exit;
}
?><!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">
<!-- DW6 -->
<head>
<!-- Copyright 2005 Macromedia, Inc. All rights reserved. -->
<title>Introduction</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="mm_travel2.css" type="text/css" />
<script language="JavaScript" type="text/javascript">
//--------------- LOCALIZEABLE GLOBALS---------------
var d=new Date();
monthname= new Array("Janvier","Février","Mars","Avril","Mai","Juin","Juillet","Août","Septembre","Octobre","Novembre","Décembre");
//Ensure correct for language. English is "January 1, 2004"
var TODAY = monthname[d.getMonth()] + " " + d.getDate() + ", " + d.getFullYear();
//--------------- END LOCALIZEABLE ---------------
</script>
<style type="text/css">
<!--
#global {
margin-left: auto;
margin-right: auto;
width: 80% ;
}
#apDiv1 {
position:absolute;
width:200px;
height:115px;
z-index:1;
}
#apDiv2 {
position:absolute;
width:502px;
height:127px;
z-index:2;
left: 451px;
top: 1px;
}
#apDiv3 {
position:absolute;
width:167px;
height:115px;
z-index:2;
left: 0px;
top: 484px;
}
#apDiv4 {
position:absolute;
width:446px;
height:130px;
z-index:2;
left: 453px;
top: -3px;
background-color: #3366CC;
}
#apDiv5 {
position:absolute;
left:382px;
top:153px;
width:401px;
height:401px;
z-index:1;
}
#apDiv6 {
position:absolute;
left:399px;
top:9px;
width:503px;
height:73px;
z-index:2;
background-color: #33FF33;
}
#apDiv7 {
position:absolute;
left:903px;
top:504px;
width:181px;
height:95px;
z-index:2;
}
#apDiv8 {
position:absolute;
left:907px;
top:510px;
width:38px;
height:27px;
z-index:3;
}
#apDiv9 {
position:absolute;
left:906px;
top:558px;
width:54px;
height:43px;
z-index:3;
}
#apDiv10 {
position:absolute;
left:946px;
top:535px;
width:0px;
height:1px;
z-index:4;
}
#apDiv11 {
position:absolute;
left:904px;
top:504px;
width:51px;
height:26px;
z-index:4;
}
#apDiv12 {
position:absolute;
left:902px;
top:502px;
width:176px;
height:29px;
z-index:2;
}
#apDiv13 {
position:absolute;
left:901px;
top:452px;
width:176px;
height:21px;
z-index:3;
}
#apDiv14 {
position:absolute;
left:853px;
top:200px;
width:254px;
height:91px;
z-index:4;
}
.Style16 {font-size: larger; }
.Style17 {font-size: large}
.Style8 {font-family: Arial, Helvetica, sans-serif;
font-size: 16px;
font-weight: bold;
}
.Style9 {font-family: Arial, Helvetica, sans-serif; font-size: 10px; font-weight: bold; }
#apDiv15 {
position:absolute;
left:54px;
top:266px;
width:247px;
height:213px;
z-index:5;
}
-->
</style>
</head>
<body bgcolor="#C0DFFD">
<div id="apDiv5"><img src="/Site/images/Logo webtransit.jpg" alt="" name="INTRO" width="400" height="400" id="INTRO" /></div>
<div id="apDiv12"><a href="Page en construction.html"><img src="/Site/images/drapeau England.jpg" width="30" height="20" alt="" /> English version</a></div>
<div id="apDiv13"><a href="Page d'accueil WEBTRANSIT.php"><img src="/Site/images/drapeau france.jpg" width="30" height="20" alt="" /> Version française</a></div>
<div id="apDiv14">
<p align="center" class="Style16"><strong>POUR ACCEDER AU SITE, CHOISIR LA LANGUE</strong></p>
<p align="center" class="Style16"> </p>
<p align="center" class="Style16"><strong>TO GO TO THE SITE, CHOOSE YOUR LANGUAGE</strong></p>
</div>
<div id="apDiv15">
<table width="94%" height="69" border="0">
<tr>
<td><p align="center" class="Style8">Espace Client:</p>
<form id="form2" name="form2" method="post" action="mailto:postmaster@web-transit.com">
<label>User
<input type="text" name="User" id="User" />
</label>
</form>
<form id="form3" name="form3" method="post" action="">
<label>Password
<input type="password" name="Password" id="Password" />
</label>
</form>
<form id="form1" name="form1" method="post" action="mailto:postmaster@web-transit.com">

<div align="left">
<input type="submit" name="OK" id="OK" value="OK" />
</div>
</form>
<p class="Style9"><a href="mailto:postmaster@web-transit.com">Vous avez oublié votre mot de passe?</a></p></td>
</tr>
</table>
</div>
<table width="1170" height="734">
<tr>
<th width="341" height="118" bgcolor="#3366CC" scope="col"><script language="JavaScript" type="text/javascript">
document.write(TODAY); </script> </th>
<th width="475" bgcolor="#3366CC" scope="col"><span class="Style17">WWW.WEB-TRANSIT.COM</span></th>
<th width="338" bgcolor="#3366CC" scope="col"> </th>
</tr>
<tr>
<td height="484"> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td><p align="center"><a href="mailto:postmaster@web-transit.com">Contact Webmaster</a> • <a href="mentions legales.php">Mentions Légales</a></p>
<p align="center" style="font-size: 0.8em;">©2008 - TOUT DROITS RESERVES - - WEB-TRANSIT.COM</p></td>
<td> </td>
</tr>
</table>
</body>
</html>
0
karikikou Messages postés 84 Date d'inscription dimanche 7 décembre 2008 Statut Membre Dernière intervention 6 juillet 2011 1
8 déc. 2008 à 12:43
personne pour m'aider??? sniiiiiff
0
karikikou Messages postés 84 Date d'inscription dimanche 7 décembre 2008 Statut Membre Dernière intervention 6 juillet 2011 1
8 déc. 2008 à 19:36
En fait un coup je place la balise DIV après body et c'est la couleur qui n'est plus bonne. Un coup je la mets avant la couleur et dans ce cas rien ne change. ????
0
karikikou Messages postés 84 Date d'inscription dimanche 7 décembre 2008 Statut Membre Dernière intervention 6 juillet 2011 1
8 déc. 2008 à 19:36
En fait un coup je place la balise DIV après body et c'est la couleur qui n'est plus bonne. Un coup je la mets avant la couleur et dans ce cas rien ne change. ????
0
wizzzzzzzzzzzz
8 déc. 2008 à 19:46
Excuses moi de te le dire mais ton code donne mal au crane. Une petite adresse test et je veux bien t'aider à déméler tout ca... mais dans l'état actuel c'est trop le boxon
0
karikikou Messages postés 84 Date d'inscription dimanche 7 décembre 2008 Statut Membre Dernière intervention 6 juillet 2011 1
8 déc. 2008 à 22:26
Lol ok je comprends, c'est clair c'est le foutoir ... ... je fais ca tout de suite merci
0
karikikou Messages postés 84 Date d'inscription dimanche 7 décembre 2008 Statut Membre Dernière intervention 6 juillet 2011 1
8 déc. 2008 à 22:43
Alors ci dessous un code test avec un tableau en guise de page intenet. je veux donc le centrer avec des marge de chaque coté afin que chaque internaute puisse bien le voir. Apparemment il faut que je place le code

<div id="global"></div>

____Ou le placer????____________________________________


<!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=utf-8" />
<title>Document sans nom</title>
</head>

</script>
<style type="text/css">
<!--
#global {
margin-left: auto;
margin-right: auto;
width: 80% ;
}
-->
</style>
<body>
<table width="1818" height="994" border="1" bgcolor="#99CCFF">
<tr>
<td width="324"> </td>
<td width="324" bgcolor="#99FFFF">dscxcdswxcdsxdsx</td>
<td width="1148"> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td height="728"> </td>
<td> </td>
<td> </td>
</tr>
</table>
</body>
</html>
0
RAD ZONE Messages postés 5230 Date d'inscription samedi 20 janvier 2007 Statut Contributeur Dernière intervention 17 août 2024 1 360
9 déc. 2008 à 00:15
SALUT

Regarde l exemple que j ai donne ici ca devrais t aider
http://www.commentcamarche.net/forum/affich 9815704 xhtml css petit souci?#1

RAD
0
karikikou Messages postés 84 Date d'inscription dimanche 7 décembre 2008 Statut Membre Dernière intervention 6 juillet 2011 1
9 déc. 2008 à 13:03
Merci beaucoup t'assure j'ai réussi a placer mes codes !!!!!!!! MERCI

Par contre j'ai maintenant une autre question. LE POSITIONNEMENT DE MON BLOC??
je veux mettre des marges de chaque coté, le coté gauche c'est ok mais le droit il bouffe le texte de la page.

Absolu, relative, fixe, statique, fluide...???.... comment dois je le paramétrer?

Merci encore
0
RAD ZONE Messages postés 5230 Date d'inscription samedi 20 janvier 2007 Statut Contributeur Dernière intervention 17 août 2024 1 360
9 déc. 2008 à 13:12
???????????

regarde j ai juste rajoute un

margin-right : 20%;

a la div contenu !!! et ca ne bouffe pas le texte !!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">        
  <head>              
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />              
    <title>RAD ZONE Webcreation               
    </title>              
    <meta name="author" content="http://radservebeer.free.fr" />              
    <meta name="generator" content="PSPad editor, www.pspad.com" />        
  </head>       
 <style type="text/css">
/*<![CDATA[*/
html {
        font-size: 100%;
}
body {
        margin: 0;
        padding: 10px 20px;
        font-family: Verdana, "Bitstream Vera Sans", "Lucida Grande", sans-serif;
        font-size: .8em;
        line-height: 1.25;
        color: #F0E39E;
        background: #444444;
}
#navigation {
        width: 18%;
        float: left;
        background: #222;
}
#contenu {
        margin-left: 20%;
        margin-right: 20%;
        margin-bottom: 20px;
        padding: 10px 20px;
        color: #fffccc;
        background: #666;
}
#entete {
        padding: 20px 0;
}
/*]]>*/
</style>
  <body>              
    <div id="global">	       
      <div id="entete"><h1>TITRE</h1>      
      </div>	       
      <div id="navigation">        
        <p>Lorem ipsum dolor sit amet consectetuer congue at eu pretium dui. Cursus congue nunc congue malesuada tincidunt Donec consectetuer id pretium semper. Ipsum venenatis Quisque condimentum metus et urna Sed In hac condimentum. Tellus ligula eros libero tortor Aliquam eget lacus Lorem tempus Proin. Tortor fringilla lacinia Vestibulum nibh tincidunt Nullam tellus urna justo penatibus. Quam enim eget in semper Sed id orci porttitor wisi et. Vestibulum auctor mi.         
        </p>             
      </div>	       
      <div id="contenu">        
        <p>Lorem ipsum dolor sit amet consectetuer sit pretium consectetuer Pellentesque pede. Nam orci Praesent consequat turpis Quisque ut sociis Sed egestas ante. Elit Sed felis vel Curabitur interdum vel Ut tempus eu fringilla. Orci elit pretium facilisi id consectetuer eget dui arcu felis molestie. Praesent Morbi id pulvinar et dui enim malesuada et nunc vel. Tellus sapien.         
        </p>        
        <p>Tincidunt felis id wisi pretium ultrices ut ante non fringilla convallis. Elit est nibh nibh mauris dolor Curabitur interdum a nibh nonummy. Pellentesque risus Quisque leo tincidunt nibh Lorem faucibus lorem tempus nunc. Eget penatibus feugiat elit pulvinar felis laoreet fames ornare pretium ante. Elit ac Vestibulum Nunc Quisque Pellentesque Donec orci ipsum.         
        </p>      
      </div>    
    </div>       
  </body>
</html>


RAD
0
wizzzzzzzzzzzz
9 déc. 2008 à 14:35
Je ne comprends toujours pas le rendu que tu cherches à donner à ta page !

Si il s'agit juste de centrer ton site rien de plus facile :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">        
  <head>              
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />              
    <title>RAD ZONE Webcreation               
    </title>              
    <meta name="author" content="http://radservebeer.free.fr" />              
    <meta name="generator" content="PSPad editor, www.pspad.com" />        
  </head>       
 <style type="text/css">
/*<![CDATA[*/
html {
        font-size: 100%;
}
body {
        margin: 0;
        padding: 10px 20px;
        font-family: Verdana, "Bitstream Vera Sans", "Lucida Grande", sans-serif;
        font-size: .8em;
        line-height: 1.25;
        color: #F0E39E;
        background: #444444;
}
#navigation {

		float: left;
        background: #222;
		width: 200px;
}
#contenu {
        color: #fffccc;
        background: #666;
		float: left;
		width: 800px;
}
#entete {
	color: white;
}

#global {
	width: 1000px;
	margin: auto;

}
/*]]>*/
</style>
  <body>
	<div id="global">
<h1 id="entete">TITRE</h1>
      <div id="navigation">        
        <p>Lorem ipsum dolor sit amet consectetuer congue at eu pretium dui. Cursus congue nunc congue malesuada tincidunt Donec consectetuer id pretium semper. Ipsum venenatis Quisque condimentum metus et urna Sed In hac condimentum. Tellus ligula eros libero tortor Aliquam eget lacus Lorem tempus Proin. Tortor fringilla lacinia Vestibulum nibh tincidunt Nullam tellus urna justo penatibus. Quam enim eget in semper Sed id orci porttitor wisi et. Vestibulum auctor mi.         
        </p>             
      </div>	       
      <div id="contenu">        
        <p>Lorem ipsum dolor sit amet consectetuer sit pretium consectetuer Pellentesque pede. Nam orci Praesent consequat turpis Quisque ut sociis Sed egestas ante. Elit Sed felis vel Curabitur interdum vel Ut tempus eu fringilla. Orci elit pretium facilisi id consectetuer eget dui arcu felis molestie. Praesent Morbi id pulvinar et dui enim malesuada et nunc vel. Tellus sapien.         
        </p>        
        <p>Tincidunt felis id wisi pretium ultrices ut ante non fringilla convallis. Elit est nibh nibh mauris dolor Curabitur interdum a nibh nonummy. Pellentesque risus Quisque leo tincidunt nibh Lorem faucibus lorem tempus nunc. Eget penatibus feugiat elit pulvinar felis laoreet fames ornare pretium ante. Elit ac Vestibulum Nunc Quisque Pellentesque Donec orci ipsum.         
        </p>      
      </div>    
	</div>
  </body>
</html>


devrait te satisfaire. Attention à l'ouverture et fermeture de tes balises qui était fausses de même que ton H1 qui étant un élement block en lui même n'as pas besoin d'être contenu daans un DIV.

Bon courage
0
RAD ZONE Messages postés 5230 Date d'inscription samedi 20 janvier 2007 Statut Contributeur Dernière intervention 17 août 2024 1 360
9 déc. 2008 à 15:13
LOOOOOL pour le h1 OK !
j avais fais cela au cas ou il voudrais ce servir de l entete sans block h !!!

mais ou tu as vue que l'ouverture et fermeture des balises qui était fausses ???

PAR CONTRE IL Y AS UNE GROSSE ERREUR !!!

J AVAIS MIS LA CSS DANS LE HTML :O

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">        
  <head>              
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />              
    <title>RAD ZONE Webcreation               
    </title>              
    <meta name="author" content="http://radservebeer.free.fr" />              
    <meta name="generator" content="PSPad editor, www.pspad.com" />              
 <style type="text/css">
/*<![CDATA[*/
html {
        font-size: 100%;
}
body {
        margin: 0;
        padding: 10px 20px;
        font-family: Verdana, "Bitstream Vera Sans", "Lucida Grande", sans-serif;
        font-size: .8em;
        line-height: 1.25;
        color: #F0E39E;
        background: #444444;
}
#navigation {
        width: 18%;
        float: left;
        background: #222;
}
#contenu {
        margin-left: 20%;
        margin-right: 20%;
        margin-bottom: 20px;
        padding: 10px 20px;
        color: #fffccc;
        background: #666;
}
#entete {
        padding: 20px 0;
}
/*]]>*/
</style>
</head> 
  <body>              
    <div id="global">	       
      <div id="entete"><p>TITRE<p>      
      </div>	       
      <div id="navigation">        
        <p>Lorem ipsum dolor sit amet consectetuer congue at eu pretium dui. Cursus congue nunc congue malesuada tincidunt Donec consectetuer id pretium semper. Ipsum venenatis Quisque condimentum metus et urna Sed In hac condimentum. Tellus ligula eros libero tortor Aliquam eget lacus Lorem tempus Proin. Tortor fringilla lacinia Vestibulum nibh tincidunt Nullam tellus urna justo penatibus. Quam enim eget in semper Sed id orci porttitor wisi et. Vestibulum auctor mi.         
        </p>             
      </div>	       
      <div id="contenu">        
        <p>Lorem ipsum dolor sit amet consectetuer sit pretium consectetuer Pellentesque pede. Nam orci Praesent consequat turpis Quisque ut sociis Sed egestas ante. Elit Sed felis vel Curabitur interdum vel Ut tempus eu fringilla. Orci elit pretium facilisi id consectetuer eget dui arcu felis molestie. Praesent Morbi id pulvinar et dui enim malesuada et nunc vel. Tellus sapien.         
        </p>        
        <p>Tincidunt felis id wisi pretium ultrices ut ante non fringilla convallis. Elit est nibh nibh mauris dolor Curabitur interdum a nibh nonummy. Pellentesque risus Quisque leo tincidunt nibh Lorem faucibus lorem tempus nunc. Eget penatibus feugiat elit pulvinar felis laoreet fames ornare pretium ante. Elit ac Vestibulum Nunc Quisque Pellentesque Donec orci ipsum.         
        </p>      
      </div>    
    </div>       
  </body>
</html>




RAD
0
wizzzzzzzzzzzz
9 déc. 2008 à 15:19
Autant pour moi elles sont corrects c'est le h1 qui m'a trompé ; )
0
karikikou Messages postés 84 Date d'inscription dimanche 7 décembre 2008 Statut Membre Dernière intervention 6 juillet 2011 1
9 déc. 2008 à 21:23
Merci à vous j'ai pas mal avancé sur ce theme, je maitrise un peu mieu les CSS maintenant
0