Divisé une page html
Fermé
misshappy
-
11 oct. 2012 à 02:52
RAD ZONE Messages postés 5224 Date d'inscription samedi 20 janvier 2007 Statut Contributeur Dernière intervention 22 mars 2024 - 11 oct. 2012 à 12:12
RAD ZONE Messages postés 5224 Date d'inscription samedi 20 janvier 2007 Statut Contributeur Dernière intervention 22 mars 2024 - 11 oct. 2012 à 12:12
A voir également:
- Diviser page html en 2 verticalement
- Supprimer une page word - Guide
- Word numéro de page 1/2 - Guide
- Diviser pdf - Guide
- Page d'accueil iphone - Guide
- Traduire une page web - Guide
2 réponses
Alain_42
Messages postés
5361
Date d'inscription
dimanche 3 février 2008
Statut
Membre
Dernière intervention
13 février 2017
894
11 oct. 2012 à 11:58
11 oct. 2012 à 11:58
avec du CSS
vas voir le site alsacreations: qui propose des gabarits, la tu trouvera ton bonheur
http://www.alsacreations.com/static/gabarits/
vas voir le site alsacreations: qui propose des gabarits, la tu trouvera ton bonheur
http://www.alsacreations.com/static/gabarits/
RAD ZONE
Messages postés
5224
Date d'inscription
samedi 20 janvier 2007
Statut
Contributeur
Dernière intervention
22 mars 2024
1 353
Modifié par RAD ZONE le 11/10/2012 à 12:33
Modifié par RAD ZONE le 11/10/2012 à 12:33
Salut
voila une base simple de 2 colonnes , a toi de la customiser a tes besoins !
a+
♣ La plus grande erreur que puisse faire un homme est d'avoir peur d'en faire une. ♣
voila une base simple de 2 colonnes , a toi de la customiser a tes besoins !
<!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>
<title>
2 Colonnes
</title>
<style type='text/css'>
/*<![CDATA[*/
.corps{
overflow: hidden;
margin: 0px auto;
width: 100%;
background: #ffffcc;
}
.header{
float: left;
width: 100%;
height: 100px;
background: #53539D;
}
.colonnes{
width: 100%;
/* background: #B1CACD; */
}
.coldroite{
overflow: hidden;
float: right;
width: 50%;
background: #8A8B65;
}
.colgauche{
overflow: hidden;
float: left;
width: 50%;
background: #2B8E8E;
}
/* decommenter si utilisation footer
.footer{
float: left;
width: 100%;
background: #83547B
}*/
body {
padding: 0px;
margin: 0px;
background: #ccffff;
}
/*]]>*/
</style>
</head>
<body>
<div class="corps">
<div class="header">
header
</div>
<div class="colonnes">
<div class="coldroite">
<p>
Lorem ipsum dolor sit amet consectetuer orci Suspendisse habitasse wisi Nam. Aenean lacinia gravida
hendrerit dignissim consectetuer consectetuer pellentesque mus Phasellus et. Risus elit leo turpis
adipiscing velit Nulla gravida vitae Lorem nibh. Vitae mauris aliquet vitae Nam Aliquam non purus Sed a
sed. Aenean sed ipsum lorem tincidunt velit lorem Aenean Nam nonummy sem. Nibh.
</p>
<p>
Elit Nulla id Mauris porttitor rutrum congue tellus Vivamus wisi Lorem. A Donec Sed Maecenas tellus
facilisis ipsum ligula id lacus Curabitur. Tellus eu Vestibulum urna Morbi Duis et Curabitur elit tempus
volutpat. Et a Cum quam at semper laoreet turpis Nam penatibus ligula. Arcu dictumst euismod tincidunt Cum
eu.
</p>
</div>
<div class="colgauche">
<p>
Lorem ipsum dolor sit amet
<br />
Consectetuer enim sit est lobortis
<br />
Donec nec sed in In
<br />
Id Cras id volutpat tortor
<br />
Mauris sollicitudin Donec Nullam velit
<br />
Tristique In convallis cursus netus
<br />
Facilisis Donec pretium eget laoreet
<br />
Neque ut augue id ante
<br />
Orci amet ac sed id
<br />
Semper tristique tempor consequat ullamcorper
<br />
Curabitur auctor dui ipsum elit
<br />
Amet aliquet dui risus penatibus
<br />
Ipsum tristique Donec tortor nunc
<br />
Lorem hendrerit eleifend leo eros
<br />
</p>
</div>
</div><!-- decommenter si utilisation footer
<div class="footer">
footer
</div>-->
</div>
</body>
</html>
a+
♣ La plus grande erreur que puisse faire un homme est d'avoir peur d'en faire une. ♣
