Hello,
J'ai un petit soucis avec ma page... Malgré un code qui me semble plutôt sain, le margin-bottom induit par margin: 20px auto dans la classe .page ne fonctionne pas comme il le devrait.
Je ne comprends pas pourquoi.
Voici le code en question :
Ca me semble correct pourtant...
Merci !
J'ai un petit soucis avec ma page... Malgré un code qui me semble plutôt sain, le margin-bottom induit par margin: 20px auto dans la classe .page ne fonctionne pas comme il le devrait.
Je ne comprends pas pourquoi.
Voici le code en question :
<head>
<title>Egonomia</title>
<style type="text/css">
body {
background-image:url(http://www.nsider.org/summit/graphics/background.gif);
color:white;
font-family:Verdana, Arial, Sans-Serif;
font-size:62.5%; /* Resets 1em to 10px */
text-align:center;
}
.page {
background:white;
height:100%;
margin:20px auto;
text-align:left;
width:621px;
}
.primary {
border-right:1px dotted white;
float:left;
padding-right:20px;
width:400px;
}
h1 {
font-family:Helvetica, Arial, Sans-Serif;
font-size:4em;
}
h2 {
background:#161416;
font-size:1.8em;
margin:0px;
padding:6px;
}
.post_meta {
background:#161416;
font-size:1.1em;
line-height:1.5em;
margin-top:10px;
padding:6px;
}
.post_text {
font-size:1.1em;
line-height:1.8em;
margin-top:10px;
}
img {
margin:0 0 10px 0;
}
.post_footer {
background:#161416;
font-size:1.1em;
margin:10px 0 40px 0;
padding:6px;
}
.sidebar {
float:left;
text-align:left;
width:200px;
}
h3 {
background:#161416;
border-bottom:1px dotted white;
font-size:1.4em;
margin:0;
padding:6px 6px 6px 20px;
}
ul {
margin:6px 0 10px 16px;
padding:0px;
}
li {
font-size:1.1em;
list-style:none;
padding:4px 0 0 6px;
}
</style>
</head>
<body>
<div class="page">
<h1>.egonomia</h1>
<div class="primary">
<h2>Un post de test juste pour voir</h2>
<div class="post_meta">Auteur : Forgaria<br>
Date : 26 Septembre 2007<br>
Categorie : Trip<br>
</div>
<p class="post_text"><img src="http://bladblog.files.wordpress.com/2007/09/mario_hugo.jpg">Second Life (most commonly known as SL) is an Internet-based virtual world launched in 2003 by Linden Lab (Linden Research, Inc.).
The project, quite confidential at the beginning, rapidly generated buzz through the blogging community and started a cultural phenomenon by mid-2006 as soon as mass media took it over.
The concept behind SL is pretty simple: you subscribe (its free), download the program, install it, log into it, create an avatar to represent your virtual self and… Play?
Not really. SL is not a game stricto sensu. Even if you can play a wide variety of games in SL, its main purpose is to be a metaverse. This barbaric term stands for environments where humans interact (as avatars) with each other (socially and economically) and with software agents in a cyber space, that uses the metaphor of the real world, but without its physical limitations*.
This is exactly what SL is: a new frontier where everything is yet to be done and can be done by its explorers.</p>
<div class="post_footer">Pas de commentaires</div>
<h2>Un post de test juste pour voir</h2>
<div class="post_meta">Auteur : Forgaria<br>
Date : 26 Septembre 2007<br>
Categorie : Trip<br>
</div>
<p class="post_text"><img src="http://bladblog.files.wordpress.com/2007/09/nopattern.jpg">Pour la petite histoire, je suis tombé sur cette vidéo alors que je récompensais ma petite soeur de 6 ans pour avoir réussi à me trouver une image de panda grâce à Google comme je l’avais mis au défi de le faire (elle est très précoce, c’est normal : il paraît qu’elle me resemble énormément). Je lui montre donc un super site, YouTube, en insistant sur le fait qu’elle pourra ainsi trouver tous les dessins animés qu’elle veut. Entre autre, Dora l’Exploratrice… Extrêmement quotable, carrément glitterrific (© Forgaria 2007) et complétement pas pour les petites soeurs.</p>
<div class="post_footer">Pas de commentaires</div>
</div>
<div class="sidebar">
<h3>Archives</h3>
<ul>
<li>Septembre 2007</li>
<li>Août 2007</li>
<li>Juillet 2007</li>
<li>Juin 2007</li>
<li>Février 2006</li>
<li>Décembre 2005</li>
<li>Novembre 2005</li>
<li>Octobre 2005</li>
</ul>
<h3>Catégories</h3>
<ul>
<li>Blogosphère</li>
<li>Buzz</li>
<li>Coding</li>
<li>Ego</li>
<li>Egonomia</li>
<li>Emory</li>
<li>Internet</li>
<li>Musique</li>
<li>Publicité</li>
<li>Technologie</li>
<li>Trip</li>
<li>Voyage</li>
<li>Webdesign</li>
</ul>
<h3>Liens</h3>
<ul>
<li>Calédosphère</li>
<li>Nick Nolte Web</li>
<li>Sous la plume de GwTy</li>
<li>Ze Gr3g</li>
</ul>
</div>
</div>
</body>
Ca me semble correct pourtant...
Merci !
