Bonjour à tous !!!
Je suis en train de traduire mon site existant, en Anglais.
J'ai décidé de tout developper en xhtml pour la version Anglaise.
la version Anglaise en CSS (CSS)
Avec le nouveau code
(edité)
et la feuille de style
Je souhaiterais comme dans la version française, coller les menus à droite, mais il s'agit d'une page à largeur extensible comment faire SVP?
(/edit)
Modifié par chooky (20 May 2005 - 21:59)
Je suis en train de traduire mon site existant, en Anglais.
J'ai décidé de tout developper en xhtml pour la version Anglaise.
la version Anglaise en CSS (CSS)
Avec le nouveau code
(edité)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Vacation island saint martin</title>
<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" />
<link href="aaaa.css" rel="stylesheet" type="text/css" />
</head>
<body>
<p id="img"><a href="contact@sxmsaintmartin.com"><img src="banieres/ban_pub2.gif" id="imgban" width="468" height="60" alt="saint martin complete guide - index" /></a>
<a href="http://www.sxmsaintmartin.com/en/"><img src="images/logo.gif" id="imglogo" width="190" height="120" alt="saint martin complete guide - index" /></a>
<a href="http://www.sxmsaintmartin.com"><img src="images/francais.png" id="imgfr" width="25" height="25" alt="saint martin complete guide - index" /></a>
<a href="http://www.sxmsaintmartin.com/en/"><img src="images/anglais.png" id="imgen" width="25" height="25" alt="saint martin complete guide - index" /></a></p>
<div id="header1">
<div><a title="Map of Saint Martin" href="http://www.sxmsaintmartin.com/map.htm">Map of saint martin</a> | <a href="http://sxmsaintmartin.com/forum//" title="forum saint martin">Forum</a></div>
<ul id="date">
<li id="horloge"></li>
<li id="ejs_server_heure"></li>
<li id="menudroite"><a title="Map of Saint Martin" href="http://www.sxmsaintmartin.com/map.htm">Map
of saint martin</a> | <a href="http://sxmsaintmartin.com/forum//" title="forum saint martin">Forum</a></li>
</ul>
</script>
</div>
<ul id="menuonglet">
<li><a title="Accueil" href="http://www.sxmsaintmartin.com/en/">Welcome</a></li>
<li><a title="Hotels" href="hotels-st-martin/saint_martin_guest-house.htm">Hotels</a></li>
<li><a title="Restaurants" href="http://www.sxmsaintmartin.com/restaurants-saint-martin/restaurants.htm">Restaurants</a></li>
<li><a title="Rentals" href="#">Rentals</a></li>
<li><a title="Beaches" href="#">Beaches</a></li>
<li><a title="Shopping" href="#">Shopping</a></li>
<li><a title="Nightlife" href="http://pulp.sxmsaintmartin.com/">Nightlife</a></li>
</ul>
</body>
</html>
et la feuille de style
html, body {
width: 100%;
height: 100%;
}
body {
margin: 0;
padding: 0;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
background-color: #ffffff; /*couleur de fond blanche*/
}
.conteneur { /*le conteneur global du site, qui sera centré */
width: 100%;
height: 100%;
position: absolute;
background-color: #99CC99;
}
p#img {
width: 0px;
height: 0px;
margin: 0px;
}
DIV#header1 {
height: 175px;
background-image: url(images/fd_header.jpg);
margin: 0px;
width: auto;
background-repeat: repeat;
}
div#header1 p
{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #CCFFFF;
text-indent: 5pt;
line-height: 25px;
}
div#header1 a
{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #CCFFFF;
font-weight: bold;
text-decoration: none;
line-height: 25px;
}
UL#date {
position: relative;
height: 30px;
margin: 0px;
width: 100%;
font-family: "Trebuchet MS";
font-size: 15px;
color: #FFFFFF;
position: relative;
left: 10px;
top: 124px;
}
ul#date li {
float: left ;
}
ul#date li a {
font-family: "Trebuchet MS";
font-size: 15px;
color: #FFFFFF;
text-decoration: none;
line-height: normal;
font-weight: normal;
}
ul#date li#horloge {
display: block;
height: 30px;
width: 150px;
}
ul#date li#ejs_server_heure {
display: block;
height: 30px;
width: 200px;
}
ul#date li#menudroite {
display: block;
height: 30px;
width: auto;
text-align: right;
}
#imglogo {
position: absolute;
top: 25px;
left: 0px;
z-index: 1;
border: 0px;
}
#imgban {
position: absolute;
top: 40px;
left: 50%;
z-index: 1;
border: 0px;
}
#imgfr {
position: absolute;
top: 0px;
left: 315px;
z-index: 1;
border: 0px;
}
#imgen {
position: absolute;
top: 0px;
left: 350px;
z-index: 1;
border: 0px;
}
ul#menuonglet, li#menuonglet { /* utilisation de liste pour le menu */
list-style-type: none; /* suppression des puces de liste */
margin:0;
padding:0;
}
ul#menuonglet {
position: absolute;
background: url(images/bouton.gif.jpg) left top;
height: 30px;
width: 560px;
text-align: center;
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 13px;
color: #CCFFFF;
left: 190px;
top: 115px;
}
ul#menuonglet li {
float: left;
background-image: url(images/bouton.gif);
}
ul#menuonglet li a {
display: block;
height: 30px;
width: 80px;
color: #CCFFFF;
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 13px;
text-decoration: none;
line-height: 30px;
}
Je souhaiterais comme dans la version française, coller les menus à droite, mais il s'agit d'une page à largeur extensible comment faire SVP?
(/edit)
Modifié par chooky (20 May 2005 - 21:59)
Chercher la petite, petite bete et pas remarquer l'éléphant qui vous marche sur le pied ... 
