) possèdent des marges internes (padding)
et externes (margin) par défaut. Le problème est que cette valeur par défaut varie
d’un navigateur à l’autre et provoque des rendus différents. Il s’agit certainement de
l’explication la plus courante lorsque des décalages apparaissent entre les diverses
plates-formes.
Le meilleur moyen d’identifier un problème de marges sur certains éléments est de...
supprimer toutes les marges de tous les éléments. Le principe est d’utiliser le sélecteur universel (*), qui s’appliquera à toutes les balises, et de mettre les marges à zéro :
* {margin: 0; padding: 0;}
Commencez votre feuille de styles par cette déclaration. Si les décalages involontaires disparaissent, vous aurez détecté un problème de marges par défaut. À vous
ensuite d’isoler l’élément qui provoque ce décalage.
Internet Explorer et le Haslayout
La notion de « haslayout » (qui possède le « layout ») est assez particulière et ne concerne que le navigateur Internet Explorer. Le layout a été inventé par Microsoft pour
conférer certaines caractéristiques à un élément. Ce concept est inhérent à ce navigateur et n’existe pas sous la forme de propriété ou règle CSS.
Selon Internet Explorer, un élément possède le layout (haslayout) ou ne le possède
pas. Certains éléments sont dotés de layout par défaut : ,

, , , , , , , <button>, <object>, <applet>...<br /> Donner le layout aux éléments qui ne le possèdent pas par défaut corrige de nombreuses incohérences sur IE : des décalages de flottants, des espaces au sein des listes<br /> et des problèmes de positionnement en général.<br /> Il existe plusieurs méthodes pour donner le layout à un élément :<br /> • heigth : valeur (par exemple heigth : 1%) ;<br /> • zoom : valeur (par exemple zoom : 1) ;<br /> • width : valeur ;<br /> • float : left ou float : right ;<br /> • position : absolute (attention aux conséquences) ;<br /> • display : inline-block (ne fonctionne pas sur Firefox 2 et versions inférieures). </div> </div> <div style="clear: both"></div> </div> <div id="viewer_control"> <a href="/viewer/alto/16182/230" class="href_previous">Précédent</a> <span class="title"> <h1><a href="https://virtuallibrary.enssmal.edu.dz/idurl/1/16182"></a> - 231/337</h1> <a href="/viewer/alto/16182/232" class="href_next">Suivant</a> </span> </div> </div> </body> </html> <script src="/assets/javascripts/jquery2.js"></script> <script src="/assets/javascripts/helpers.js"></script> <script> var height = $(window).height(); var width = $(window).width(); $('#viewer_img').height(height - 135); $('#viewer_alto').height(height - 135); </script> </body> </html>