Problème CSS et navigateurs (+ lycos ?)

Bonsoir,

Je me suis mis depuis quelques temps au CSS et XHTML... Et déjà, les problèmes surviennent !

[1] Problème 01

Déjà, il y a une chose que je ne comprend pas : lorsque dans une feuille CSS nous mettons :

body
{
width: 700px ;
margin: auto ;
}

... Il s'avère que le navigateur Internet Explorer adopte un comportement ressemblant à un width: 100% ! Donc biensûr jusqu'ici, c'est logique que le bloc body ne soit pas centré.

J'en ai donc tiré la conclusion suivante, et j'ignore si elle est fausse : Internet Explorer n'accèpte pas qu'on définisse une taille pour le BODY.

J'ai donc opté la solution basique : créer une balise universelle DIV en lui mettant un nom ridicule (leBody) . J'écris donc :

leBody
{
width: 700px ;
margin: auto ;
}

...et je supprime les propriétés indiquées pour Body simple.

Donc là, impécable ! Le bloc principal du site est bien centré quelque soit la résolution, et quelque soit le navigateur.

Le problème : une fois que je transfère la chose sur l'hébergeur Lycos, le bloc se réaligne à gauche sur IE. Par contre sur Firefox ça marche.

Quelqu'un serait-il pourquoi ? Cela vient-il de Lycos ?

[2] Problème 02

Celui là, toujours en rapport avec le CSS, est un peu bizare. Voici un code source vite fait pour montrer comment est structuré un morceau du fichier XHTML :

<div id="lebody">
<div id="partie_enTete">
<table id="barreInformations">
<tr><td class="barreInfo_titre">Barre d'Information</td></tr>
<tr><td class="barreInfo_contenu">Le contenu</td></tr>
</table>
<div id="barreMenu">
<a id="lienAccueil" href="#">Accueil</a>
<a id="lienInformations" href="#">Informations</a>
<a id="lienLiens" href="#">Liens</a>
<a id="lienInformatique" href="#">Informatique</a>
<a id="lienDivers" href="#">Divers</a>
<a id="lienMiniTChat" href="#">Mini Tchat</a>
<a id="LienContact" href="#">Contact</a>
</div>
</div>

... Là, tout est Ok, mais lorsque je veux appliquer par exemple une largeur de 2,4 cm et une bordure blanche tout autour :

#lebody #partie_enTete #barreMenu a
{
width: 2,4cm ;
border: 1px white solid ;
}

... en local, sur IE et Firefox il n'y a pas les 2,4 cm respectés : la largeur s'adapte au contenu du texte. Sur IE, il n'y a qu'une bordure à droite et à gauche de chaque lien, mais pas en bas et en haut. Et je dois dire que même en essayant les propriétés pour chacune des bordures, ça ne fonctionne pas.

... une fois sur l'hébergeur lycos : IE affiche bien les 2,4 cm pour chaque liens, et les bordures sont de tous les côtés comme il le faut. Par contre sur Firefox, les 2,4 cm ne sont pas respectés (pareil qu'en local donc), mais les bordures sont bien présentes tout autour des liens.

A titre d'information, j'ai aussi essayé de faire pour chaque id des liens pour mettre les propriétés, mais rien n'y fait !