28112 sujets

CSS et mise en forme, CSS3

Pages :
littlesam a écrit :
Je vais pas répondre sinon je vais devenir grossière.

Lu sur Acces pour tous:

Les polices de caractère a écrit :
Pour ceux qui cherchent à maintenir un aspect identique à ce qu'ils ont sur leur ordinateur, il faut qu'ils se disent qu'ils se sont trompés de média et que mieux vaut une page dont la mise en page est un peu chamboulée mais qui est consultable par tout le monde qu'une page figée mais illisible pour de nombreuses personnes.
Pour faire en sorte que vos pages se redimensionnent le plus harmonieusement possible définissez l'ensemble de vos CSS avec des valeurs relatives et non pas seulement la taille des textes.


note: ne pas prendre l'utilisateur pour un idiot, c'est lui qui a toute maîtrise sur la taille par défaut qu'il souhaite définir, s'il souhaite une taille minimale de 20px c'est qu'il doit avoir ses raisons. C'est toujours lui qui décide de revenir ou non consulter une ressource en ligne. Smiley cligne
Pour ceux qui ont suivit la discution je vais mettre ici ma solucion, ça peut servir :


   <div class="news">
     <h3>10 janvier 2005</h3>
     <h4>titre</h4>
     <div class="infos">
      <span class="category">categorie</span>
	<br />
      <span class="author">sam</span>
      <span class="time">20h15</span>
     </div>
     <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
     <p class="comment">commenter</p>
    </div>



body {
 font-family:  arial, sans-serif;
 font-size: 100%;
}
div.news h4 {
 float: left;
 margin: 0px 5px 0px 5px;
 padding: 0px;
 font-family:  arial, sans-serif;
 font-size: 1.5em;
 line-height: 1.5em;
 color: #88c065;
}
div.news div.infos {
 float: left;
 padding: 0px 0px 0px 5px;
 border-left: 1px solid #cccccc;
 font-size: 0.9em;
 line-height: 1.25em;
}
div.news p {
 clear: both;
}
div.news p.comment {
 margin: 10px;
 border-top: 1px solid #cccccc;
 text-align: right;
 font-size: 0.9em;
}
Pages :