Salut,
J'suis en train de développer un site web pour l'uni est j'ai rencontré trois problèmes assez originaux.
Le premier est avec IE. Lorsque j'ouvre mon site, les images ont une marge en dessous que je n'arrive pas à supprimer. Comme si "margin-bottom" était réglé à 2px, alors qu'il est expressement mis à 0.  
Le deuxième est avec Firefox: le chargement du site se fait en deux temps. D'abord l'entête puis, tant que je n'appuye pas sur "rafraîchir", le texte ne se charge pas.
Enfin, sous Opera, la marge du corps et décallé par rapport à l'entête. Ceci semble être lié à la prise en compte des border qui sont de 2px pour l'entête comme pour le corps. La largeur des div est donc de 896px afin que la largeur totale du site soit de 900px. Pour le corps, si je mais la largeur à 900px, il est en ligne avec l'entête dans opera mais pas dans firefox. Si je le mais à 896px, il est en ligne avec firefox mais pas dans opera. Beau paradoxe, non? Quelle browser devrais-je "favoriser"?  
J'ai fait qq recherches sur le web ss rien trouver. Quelqu'un à une idée? le site en projet peut être visité à www.maxoettliphotograph.ch/uni/projet1
Merci d'avance,
jr

Pour un site on met toujours:

 
au début du CSS, pour pas se faire chier avec les marges...
 

 
  ça on me lavais jamais fait, toi tu la inventé bravo    
 
ça c'est mieux:
 

 
Si tu veux appliquer un style en plus sur programme, entoure le avec des <span>...
 
Sinon tente de corriger les erreurs de validation et ça devrait etre un peu mieux

Je reconnais que <a...><li>..</li></a> est original, mais c'est le seul moyen que j'ai trouvé de faire changer l'arrière plan de li lors d'un a:hover. Y a-t-il une autre méthode plus orthodoxe?
Merci pour le truc du *, je reboot sous windows pour voir si ça marche sous IE.

je tai dit, petit homme qui lis pas tout....
 

 
Désolé de te décevoir mais je trouve ton effet hover, horrible    

Trois choses.  
1. J'avais lu ton histoire du span, mais suis pas convaincu qu'il permette de couvrire l'entier de mon horrible effet hover. En effet, il recouvrira que le texte du <a>...</a> et non l'entier de la case li.
2. T'as pas une idée pourquoi il se charge en deux temps sur firefox?
3. Qu'est-ce qui te fais dire que ch'suis un homme?

lol mdr j'ai du faire une gaffe sur le sex
 
men voit désolé, mes mains qui tape plus vite que mon cerveau...
 
Sinon toi tu veux quoi ...comme effet sur ton menu ?
 
Tu sais que tu peux appliquer un style au li du menu directement?
 
Pour le 2 temps, moi jai pas ce souci... c'est où exactement

Bon. En ce qui concerne le menu, qd je passe la souris sur le lien, la case li du lien prend la même couleur de fond que le border un peu plus large sur la gauche et le texte devient blanc. En gros, ça fait un très beau rectangle rouge foncé encadrant le texte blanc du lien et s'étandant du boder-left au border right. Très esthètique ;-).
Concernant le deux temps, lorsque je le charge avec Firefox, toute la partie du haut s'affiche dans un premier temps puis je dois taper F5 pour que le reste du document s'affiche. Comme entrée en matière, il y a mieux.

Ah oui, le truc du # {margin: 0;} n'a pas fonctionné. J'ai tjrs une marge bizarre qui apparaît sous mes images avec IE.

Ah oui, cette fois-si j'ai lu un peu vite. Pour appliquer un style au li(t), j'ai remarqué que li:hover fonctionne très bien sous Firefox mais pas sous IE...

 
 
* {margin: 0;}
 
ensuite pour ton menu la question se pose pas
Tu met comme j'ai dis et puis c'est tout, on invente pas des régles..
 
Et oui tu pourras stylé ça vite fait..
 
Ensuite sous FF, moi pas de souci, donc te prend pas la tête...
 
sous ie, pose toi des questions c'est pas trés beau à voir..
 
Aller change ce que je tai dis en logne, aprés on en rediscute...
 
Et donc au final --> fille ou garçon ?

Moi sous FF je dois aussi faire F5 :S
Mais sa fait que sa le premiere fois que tu va sur le site, apres sa le garde en mémoire, mais c'est clair que tu pe pas garder sa comme ça

Au risque de te décevoir: homme. J'aurai peut-être pas du dire ça mnt, si j'ai encore qq questions.
J'ai donc fait un menu w3c compatible, avec li avant le a, etc. Seulement, mon menu est du coup un désastre (j'en viendrai presque à être d'accord avec toi). Soit je fais un a:hover, en quel cas seul l'espace autour du lien change de background color (et non tout le rectangle jusqu'au border du menu) (et, en plus, si je ne passe pas exactement sur le texte du lien mais dans la zone du li, rien ne se passe). Soit je fais un li:hover, en quel cas le fond du li change de couleur quand je passe dans la case li, mais le lien reste noir....
 
le # au lieu de * était un faute de frappe sur le forum. Dans le script, j'ai mis * et ça n'a pas marché... En ce qui concerne IE, est-ce que t'as aussi l'espace sous les images (donc la magnifique rade de Genève et la déco)?

 
 
Eh ouais, donc faut appliquer le hover sur <a>
 
et tu fais un display block

Devilhunt: c'est clair que je veux pas garder ça comme ça, mais n'ai jms eu de problème semblable et ne sais donc pas comment le résoudre. Une idée?

Si t'as vu mon topic, dsl je suis une vrai merde, sa fait que 3 jours que j'ai commencé a programmer (autrement que les istes multimania MDR ou les kit graphiques que je modifiai avec frontpage, sans jamais toucher aux lignes de codes). Donc je peut pas t'aider :S

Homme, bien vais pouvoir etre méchand comme d'hab...lol
 
alors pour le menu, regarde mon post précédent...
 
ensuite, ton image de banniére, est un peu lourde, optimise là
 
Aprés il y a plein dimage qui souvre pas sur ton site...va savoir pourquoi... lien mort...
 
Valid ton code,  
http://validator.w3.org/
 
Hum et met un doctype etc...
 
Pour toi aller on va faire avec xhtml 1.0
 
Donc met ça dans ton code:
 

 
....
 
Aller op op op au boulot... et pourquoi je savais que tetais un mec...dans le nom de ton site: max...

Le display block il intervient où? Tu veux dire que je laisse complètement tomber les li?

RRRrr t con ou tu écoutes rien...
 
Un menu c'est toujours et toujours:
 
<ul>
  <li>....</li>
  <li>.....
 
Tu applique les display:block sur le lien dans le <li>

De un. Concernant le doctype, c'est pas que j'ai oublié, c'est que pour l'instant je m'en fous de l'introduire fais d'aobrd le site.  
De deux, max, c'est mon père. Donc que je sois sa fille ou son fils, ...
De trois, les liens morts, c'est un peu normal, vu que seule la page d'accueil a été écrite pour l'instant.  
Optimiser image de barrière = la convertir en png?
As-tu pu tester sous IE? Tu comprends ce que je veux dire par marges en plus sous les photos?
Une idée pour le chargement en deux temps?
Pourquoi t'es pas méchant avec les femmes, elles le sont svt avec nous?

si je vois ce qu il veut dire sur ff
c est parce qu il definit un hover pour li et pour a
en sachant qu il vaut mieux eviter les hover s ils ne sont pas sur un a car ie ne comprend que sur a

donc tu vires les ul li et ul li:hover

et tu fais ton menu comme l a dit xtof

Je te dis de foutre ce putain de doctype donc tu le met...sinon on peu pas bosser dans doctype, ils tapprenent quoi les abrutis qui te font cours à luniversité....
Sans doctype, le navigateur, prend un par défaut, et tu as pas toujours le comportement que tu souhaites...
 
Pour que ce soir plus simple, applique tes modifs, en ligne...merci
 
Vaide ton code...
 
Oui sous IE, je vois ton probléme...
Optimise el code, aprés on vois...
 
Optimier une image = tu ouvre gimp, car tu as pas les sousous pour photoshop... tu enregistes, et tu choisis le % de compression....
 
Chargement en 2 temps j'ai pas donc on voit ça plus tard...
 
Femmes= men fout, donc moi elle sont pas méchante avec moi...

Ok.
J'ai insérer le doctype bien que j'ai pas capté tpn histoire de 1. Si t'es motiver pour expliquer, mais bon, c'est pas une priorité.
J'ai compressé l'image sous gimp car sous linux, il y a pas de photoshop (sous ou pas)
chargement en deux temps: sous FF, il faut vider le cache avant.

ah oui, j'ai mis directement les modifs en ligne.
Qd on a display:block on peut jarter les li sur le code html, non?

Nouveau, depuis l'insertion de doctype, j'ai aussi des marges en plus sur FF...

 
 
Dis moi tu veux que je te descende ou quoi, je vais le répété combien de fois            
 
 
  Aller je me resaisi, si tu veux ma mort    dis le de suite...
 
Bon tu vois now... tu as la meme connerie despacement sous FF, ça c'est cool
 
* {
margin:0;
padding:0;
}
 
Oublie pas ça dnas le CSS. meme si là ça change rien, c'est pour les autres fois
 
Bon aller vais regarder dou viend cette espacement

Remplace ça:
 

 
Par:
 

 
Les "|" joue avec les borders

C'est fait.

J'ai même adapté le script css pour compenser la nouvelle balise...

J'ai fait validé le script html et css. Ils sont ok.

Bon pas mal
 
Alors ensuite, les trucs du style <div><img/></div>
 
ça sert à rien une div sert uniquement pour des blocs délément, si tu as qu'un élément pas besoin de lentourer de plus de truc...

T'as ni trouvé pourquoi la page se charge en deux temps lors de la permière ouverture ni d'où proviennent ces mystérieux espaces?

Te dis moi ma page se charge nickel, sous FF, IE windows, et FF linux
 
 
Mais tu as pas optimiser ton image, ça devrait faire 60-100ko max

Ok. Merci bcp pour toutes ces infos et pour le temps que t'as consacré à ce site horrible.;-)
jr

ça marche tout nickel ?

Ben, pas vraiment.  
1. Lorsque le cache du navigateur est vide, le site se charge tjrs en deux temps.
2. Il y a tjrs des marges inexpliquées sous les marges

J'ai enfin trouvé une solution pour les images. Je le reporte ici pour clôre le sujet.  
 

 
src: http://archivist.incutio.com/viewl [...] cuss/25853
 
Un grand merci pour votre aide.
jr