bonjour,
voila j'ai un site de voyage : http://passiondesvoyages.fr et je suis en train de le passer en css mais j'arrive pas à mettre mes images sur deux lignes, cela me les met en vertical et c'est pas ce que je veux, voici le code :
<code>
<!DOCTYPE html>
<html lang="fr">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<title>photossoudan</title>
<style>
html, body{
padding:0;
margin:0;
font:1em/1.25em Verdana;
background:sandybrown;
text-align:center;
}
a{
color:#000;
}
#header{
}
.article{
display:inline-block;
margin:1em;
text-shadow: 1px 1px 0px #fff;
width:110px;
vertical-align:top;.
}
.article img{
display:block;
width:100px;
height:100px;
margin:1em auto;
box-shadow: 0px 2px 4px 2px #888;
}
.article p{
}
#footer{
font-size:1em;
clear:both; /* force le retour à la ligne */
}
#footer ul{
display:inline-block;
margin:1em;
padding:0;
list-style:none;
}
#footer ul li{
display:inline-block;
margin:0 1em;
}
</style>
<meta name="generator" content="Namo WebEditor v5.0">
</head>
<body>
<script language="JavaScript">
function ejs_nodroit()
{
alert('Clic droit interdit');
return(false);
}
document.oncontextmenu = ejs_nodroit;
</script>
<SCRIPT LANGUAGE="JavaScript">
texteAff = "bienvenue au soudan";
place = 0;
tempoLong = 100;
function EJSAnimEtat2()
{
texteTemp1 = texteAff.substring(0,place);
texteTemp2 = texteAff.substring(place,place+1);
texteTemp2 = texteTemp2.toUpperCase();
texteTemp3 = texteAff.substring(place+1,texteAff.length);
window.status = texteTemp1 + texteTemp2 + texteTemp3;
if (place>texteAff.length)
{
place=0;
tempoLong=1000;
}
if (place==0)
tempoLong=100;
place++;
tempoAnimEtat2 = setTimeout("EJSAnimEtat2()",tempoLong)
}
function EJSAnimEtat2Break()
{
window.status = "";
clearTimeout(tempoAnimEtat2);
}
window.onload = EJSAnimEtat2;
window.onunload = EJSAnimEtat2Break;
</SCRIPT>
<div id="header">
<br><h1><u>Galerie photos SOUDAN 2003</u></h1>
</div>
<div class="article">
<a href="photosbayuda.htm" target="_self"><img src="imagecompsoudan33.jpg"></a>
<p><i>Désert de Bayuda</i></p>
<a href="photosnubie.htm" target="_self"><img src="imagecompsoudan45.jpg"></a>
<p><i>Désert de Nubie</i></p>
<a href="photosdoscha.htm" target="_self"><img src="imagecompsoudan63.jpg"></a>
<p><i>Doscha</i></p>
<a href="photoselkurru.htm" target="_self"><img src="imagecompsoudan41.jpg"></a>
<p><i>El Kurru</i></p>
<a href="photoskerma.htm" target="_self"><img src="imagecompsoudan83.jpg"></a>
<p><i>Kerma</i></p>
<a href="photoskhartoum.htm" target="_self"><img src="imagecompsoudan5.jpg"></a>
<p><i>Khartoum</i></p>
<a href="photosmeroe.htm" target="_self"><img src="imagecompsoudan19.jpg"></a>
<p><i>Méroé</i></p>
<a href="photosnaga.htm" target="_self"><img src="imagecompsoudan7.jpg"></a>
<p><i>Naga</i></p>
<a href="photosdongola.htm" target="_self"><img src="imagecompsoudan85.jpg"></a>
<p><i>Old Dongola</i></p>
<a href="photossedinga.htm" target="_self"><img src="imagecompsoudan66.jpg"></a>
<p><i>Sedinga</i></p>
<a href="photossessibi.htm" target="_self"><img src="imagecompsoudan72.jpg"></a>
<p><i>Sessibi</i></p>
<a href="photossoleb.htm" target="_self"><img src="imagecompsoudan55.jpg"></a>
<p><i>Soleb</i></p>
<a href="photostombos.htm" target="_self"><img src="imagecompsoudan76.jpg"></a>
<p><i>Tombos</i></p>
</div>
<br><br><br>
<p style="text-align:center"><a href="http://passiondesvoyages.fr">Index</a></p>
<br><br><br>
</body>
</html>
</code>
alors pour information je suis jardinier et que je patine un peu en html et css alors un coup de main ne serait pas de trop, je suis sur que c'est les balises margin et padding que j'ai du mal renseigner, j'ai du mal à les maitriser aussi.
pour l'instant la seule page que j'ai changé aussi, merci d'être indulgent.
voila j'ai un site de voyage : http://passiondesvoyages.fr et je suis en train de le passer en css mais j'arrive pas à mettre mes images sur deux lignes, cela me les met en vertical et c'est pas ce que je veux, voici le code :
<code>
<!DOCTYPE html>
<html lang="fr">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<title>photossoudan</title>
<style>
html, body{
padding:0;
margin:0;
font:1em/1.25em Verdana;
background:sandybrown;
text-align:center;
}
a{
color:#000;
}
#header{
}
.article{
display:inline-block;
margin:1em;
text-shadow: 1px 1px 0px #fff;
width:110px;
vertical-align:top;.
}
.article img{
display:block;
width:100px;
height:100px;
margin:1em auto;
box-shadow: 0px 2px 4px 2px #888;
}
.article p{
}
#footer{
font-size:1em;
clear:both; /* force le retour à la ligne */
}
#footer ul{
display:inline-block;
margin:1em;
padding:0;
list-style:none;
}
#footer ul li{
display:inline-block;
margin:0 1em;
}
</style>
<meta name="generator" content="Namo WebEditor v5.0">
</head>
<body>
<script language="JavaScript">
function ejs_nodroit()
{
alert('Clic droit interdit');
return(false);
}
document.oncontextmenu = ejs_nodroit;
</script>
<SCRIPT LANGUAGE="JavaScript">
texteAff = "bienvenue au soudan";
place = 0;
tempoLong = 100;
function EJSAnimEtat2()
{
texteTemp1 = texteAff.substring(0,place);
texteTemp2 = texteAff.substring(place,place+1);
texteTemp2 = texteTemp2.toUpperCase();
texteTemp3 = texteAff.substring(place+1,texteAff.length);
window.status = texteTemp1 + texteTemp2 + texteTemp3;
if (place>texteAff.length)
{
place=0;
tempoLong=1000;
}
if (place==0)
tempoLong=100;
place++;
tempoAnimEtat2 = setTimeout("EJSAnimEtat2()",tempoLong)
}
function EJSAnimEtat2Break()
{
window.status = "";
clearTimeout(tempoAnimEtat2);
}
window.onload = EJSAnimEtat2;
window.onunload = EJSAnimEtat2Break;
</SCRIPT>
<div id="header">
<br><h1><u>Galerie photos SOUDAN 2003</u></h1>
</div>
<div class="article">
<a href="photosbayuda.htm" target="_self"><img src="imagecompsoudan33.jpg"></a>
<p><i>Désert de Bayuda</i></p>
<a href="photosnubie.htm" target="_self"><img src="imagecompsoudan45.jpg"></a>
<p><i>Désert de Nubie</i></p>
<a href="photosdoscha.htm" target="_self"><img src="imagecompsoudan63.jpg"></a>
<p><i>Doscha</i></p>
<a href="photoselkurru.htm" target="_self"><img src="imagecompsoudan41.jpg"></a>
<p><i>El Kurru</i></p>
<a href="photoskerma.htm" target="_self"><img src="imagecompsoudan83.jpg"></a>
<p><i>Kerma</i></p>
<a href="photoskhartoum.htm" target="_self"><img src="imagecompsoudan5.jpg"></a>
<p><i>Khartoum</i></p>
<a href="photosmeroe.htm" target="_self"><img src="imagecompsoudan19.jpg"></a>
<p><i>Méroé</i></p>
<a href="photosnaga.htm" target="_self"><img src="imagecompsoudan7.jpg"></a>
<p><i>Naga</i></p>
<a href="photosdongola.htm" target="_self"><img src="imagecompsoudan85.jpg"></a>
<p><i>Old Dongola</i></p>
<a href="photossedinga.htm" target="_self"><img src="imagecompsoudan66.jpg"></a>
<p><i>Sedinga</i></p>
<a href="photossessibi.htm" target="_self"><img src="imagecompsoudan72.jpg"></a>
<p><i>Sessibi</i></p>
<a href="photossoleb.htm" target="_self"><img src="imagecompsoudan55.jpg"></a>
<p><i>Soleb</i></p>
<a href="photostombos.htm" target="_self"><img src="imagecompsoudan76.jpg"></a>
<p><i>Tombos</i></p>
</div>
<br><br><br>
<p style="text-align:center"><a href="http://passiondesvoyages.fr">Index</a></p>
<br><br><br>
</body>
</html>
</code>
alors pour information je suis jardinier et que je patine un peu en html et css alors un coup de main ne serait pas de trop, je suis sur que c'est les balises margin et padding que j'ai du mal renseigner, j'ai du mal à les maitriser aussi.
pour l'instant la seule page que j'ai changé aussi, merci d'être indulgent.