style css et IE

Le 23/03/2013 19:16, alainL a écrit :

Bonsoir,
Encore une fois, IE ne réagit pas comme Ffx. Je voudrais obtenir un div
"global" de 900px, centré. C'est OK avec Firefox mais avec IE, le div
n'est pas centré et tout reste à gauche.

http://autourdalos.fr/html/saliga130321.htm

Merci pour vos suggestions.

Je n'arrive pas à charger ta page. Tu as utilisé text-align: center; ou
width: 900px; margin-left: auto; margin-right: auto;

--
Site : http://www.grenault.net
Cours photo : http://www.grenault.net/tech.htm
Home cinéma : http://www.grenault.net/homecine.htm

Tu ne peux pas accéder à la page ou pas à voir le code ?
J'ai defini un <style> dans le head.
html, body {
height: 100%;
width: 100%;
overflow:auto;
background:#020501;
}


body {
font-family:Arial, Helvetica, Verdana, sans-serif;
font-size: 0.8em;
margin: 0;
padding: 0;
color : #CCCCCC;
}
a:link{color:#FFD700;text-decoration:underline;}

#global {
min-height: 100%;
width: 900px;
overflow: hidden;
margin-left: auto;
margin-right: auto;
}

</style>

Je viens de vérifier aussi sur Chrome, ça va. Mais toujours pas sur IE :-(


AlainL

http://autourdalos.fr

Le 23/03/2013 20:32, GR a écrit :

Le 23/03/2013 19:16, alainL a écrit :

Bonsoir,
Encore une fois, IE ne réagit pas comme Ffx. Je voudrais obtenir un div
"global" de 900px, centré. C'est OK avec Firefox mais avec IE, le div
n'est pas centré et tout reste à gauche.

http://autourdalos.fr/html/saliga130321.htm

Merci pour vos suggestions.

Je n'arrive pas à charger ta page. Tu as utilisé text-align: center; ou
width: 900px; margin-left: auto; margin-right: auto;

dans (in) fr.comp.infosystemes.www.auteurs, alainL
<jarailetxsansx@gmail.com> ecrivait (wrote) :

Bonsoir Alain,

Encore une fois, IE ne réagit pas comme Ffx. Je voudrais obtenir un div
"global" de 900px, centré. C'est OK avec Firefox mais avec IE, le div
n'est pas centré et tout reste à gauche.
http://autourdalos.fr/html/saliga130321.htm

Il faut appliquer un patch dans ta feuille CSS, en mettant en premier la
CSS correcte de l'élément, puis derrière la CSS modifiée pour IE, avec
une classe conditionnelle.

Quelques explications ici :

http://www.alsacreations.com/astuce/lire/988-classe-conditionnelle-ie.html

--
Eric

Le 23/03/2013 20:40, alainL a écrit :

Tu ne peux pas accéder à la page ou pas à voir le code ?
J'ai defini un <style> dans le head.
html, body {
height: 100%;
width: 100%;
overflow:auto;
background:#020501;
}


body {
font-family:Arial, Helvetica, Verdana, sans-serif;
font-size: 0.8em;
margin: 0;
padding: 0;
color : #CCCCCC;
}
a:link{color:#FFD700;text-decoration:underline;}

#global {
min-height: 100%;
width: 900px;
overflow: hidden;
margin-left: auto;
margin-right: auto;
}

</style>

Je viens de vérifier aussi sur Chrome, ça va. Mais toujours pas sur IE :-(


AlainL

http://autourdalos.fr

Le 23/03/2013 20:32, GR a écrit :

Le 23/03/2013 19:16, alainL a écrit :

Bonsoir,
Encore une fois, IE ne réagit pas comme Ffx. Je voudrais obtenir un div
"global" de 900px, centré. C'est OK avec Firefox mais avec IE, le div
n'est pas centré et tout reste à gauche.

http://autourdalos.fr/html/saliga130321.htm

Merci pour vos suggestions.

Je n'arrive pas à charger ta page. Tu as utilisé text-align: center; ou
width: 900px; margin-left: auto; margin-right: auto;

Temps de réponse très long.

--
Site : http://www.grenault.net
Cours photo : http://www.grenault.net/tech.htm
Home cinéma : http://www.grenault.net/homecine.htm

Bonjour,

Vous avez pu remarquer que alainL vient d'écrire

http://autourdalos.fr/html/saliga130321.htm

Merci pour vos suggestions.

Avec Chrome, c'est centré mais ... ....
Pfffffffiiiiiiiiiooooooouuuuuuuu. Plus d'une minute pour télécharger la
page. Je sais que mon ADSL n'est pas très performant (3880m du NRA) mais
quand même !!!
En temps ordinaire, il y a longtemps que j'aurais abandonné :-(
--
Cordialement
guy.siaurg@free.invalid
http://fonderie.indret.free.fr

Bonjour,
Je ne bricole que par à-coups et, par manque de pratique, j'oublie la
syntaxe. Alors je fais pas mal de copier-coller que j'arrange comme je
peux :-((
J'ai donc pour cette page utilisé le squelette d'une autre d'un vieux
site avec
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

mais j'ai aussi repris des balises sur une page plus récente utilisant

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

et le changement du 1 en 2 a été efficace !

Merci pour ta suggestion, je garde quand même le lien :-)
Bonne journée.


AlainL

http://autourdalos.fr

Le 23/03/2013 20:44, Eric Demeester a écrit :

dans (in) fr.comp.infosystemes.www.auteurs, alainL
<jarailetxsansx@gmail.com> ecrivait (wrote) :

Bonsoir Alain,

Encore une fois, IE ne réagit pas comme Ffx. Je voudrais obtenir un div
"global" de 900px, centré. C'est OK avec Firefox mais avec IE, le div
n'est pas centré et tout reste à gauche.
http://autourdalos.fr/html/saliga130321.htm

Il faut appliquer un patch dans ta feuille CSS, en mettant en premier la
CSS correcte de l'élément, puis derrière la CSS modifiée pour IE, avec
une classe conditionnelle.

Quelques explications ici :

http://www.alsacreations.com/astuce/lire/988-classe-conditionnelle-ie.html

Bonjour Alain,

Le 24/03/2013 09:26, alainL a écrit :

Je ne bricole que par à-coups et, par manque de pratique, j'oublie la
syntaxe. Alors je fais pas mal de copier-coller que j'arrange comme je
peux :-((
J'ai donc pour cette page utilisé le squelette d'une autre d'un vieux
site avec
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

Beuh !

Le seul doctype sans url est le doctype HTML5. Note que c'est une bonne
idéee de copier-coller le doctype, mais à condition de choisir dans une
liste correcte !

Si tu as perdu cette liste, demande à Google :
https://www.google.fr/search?hl=fr&q=choix%20du%20doctype

Par exemple, chez alsacreations où t'envoyait Éric :
http://www.alsacreations.com/article/lire/560-dtd-doctype-html-xhtml-comment-choisir.html

S'il y a *une* chose que tu ne dois pas faire à la légère, c'est bien
le choix du doctype. Si l'on ne tient pas compte de HTML 5, je te
suggère la démarche suivante :

1) Choisir le doctype HTML 4.01 Transitional(¹) et passer ta page au
validateur <http://validator.w3.org/>.

2) Corriger toutes les erreurs. Venir éventuellement demander de
l'aide ici -- au risque de te faire chambrer si le message du
validateur est tellement clair que tu aurais dû t'en sortir
tout seul, mais bon, c'est le risque.

3) Changer pour le doctype HTML 4.01 Strict(²) et repasser ta page au
validateur.

4) Corriger toutes les erreurs.

Je te déconseille XHTML à moins que tu n'en aies absolument besoin
(c'est-à-dire que tu puisses expliquer pourquoi tu as absolument
besoin de XHTML plutôt que de HTML).

(¹)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

(²)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

mais j'ai aussi repris des balises sur une page plus récente utilisant

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

et le changement du 1 en 2 a été efficace !

Aaaaargh ! Ta page n'est *pas* en XHTML, alors tu ne dois *pas*
prendre un doctype XHTML !

http://validator.w3.org/check?uri=http%3A%2F%2Fautourdalos.fr%2Fhtml%2Fsaliga130321.htm

Le 23/03/2013 20:44, Eric Demeester a écrit :

dans (in) fr.comp.infosystemes.www.auteurs, alainL
<jarailetxsansx@gmail.com> ecrivait (wrote) :

[citation intégrale après ta réponse]

C'est aussi par manque de pratique que tu oublies la syntaxe de la
façon de répondre sur usenet ?
<http://www.usenet-fr.net/fur/usenet/repondre-sur-usenet.html>

Cordialement,
--
Olivier Miakinen

dans (in) fr.comp.infosystemes.www.auteurs, alainL
<jarailetxsansx@gmail.com> ecrivait (wrote) :

Bonjour Alain,

En complément de la réponse d'Olivier :

Je ne bricole que par à-coups et, par manque de pratique, j'oublie la
syntaxe. Alors je fais pas mal de copier-coller que j'arrange comme je
peux :-((

Tu n'es pas la seule personne à procéder ainsi, mais par expérience, et
aussi parce que je suis souvent amené à dépanner des personnes
appliquant des solutions copiées/collées sans comprendre leur
fonctionnement, ce n'est pas une bonne pratique.

En effet, comme tu viens de le constater, dès qu'un problème se pose, on
est démuni, et le temps « gagné » à appliquer des solutions toutes
faites, est très largement perdu quand ça ne fonctionne plus ; sans
parler des effets de bord signalés par Olivier.

à mon sens, mieux vaut « perdre du temps » en apprenant et en comprenant
ce qu'on fait, puisqu'au final, on acquiert des connaissances et de
l'expérience, qui... font gagner énormément de temps, et récompensent
l'effort inititial au centuple.

Enfin, c'est ma philosophie à moi que j'ai.

--
Eric

Le 24/03/2013 11:57, Eric Demeester a écrit :

dans (in) fr.comp.infosystemes.www.auteurs, alainL
<jarailetxsansx@gmail.com> ecrivait (wrote) :

Bonjour Alain,

En complément de la réponse d'Olivier :

Je ne bricole que par à-coups et, par manque de pratique, j'oublie la
syntaxe. Alors je fais pas mal de copier-coller que j'arrange comme je
peux :-((

Tu n'es pas la seule personne à procéder ainsi, mais par expérience, et
aussi parce que je suis souvent amené à dépanner des personnes
appliquant des solutions copiées/collées sans comprendre leur
fonctionnement, ce n'est pas une bonne pratique.

En effet, comme tu viens de le constater, dès qu'un problème se pose, on
est démuni, et le temps « gagné » à appliquer des solutions toutes
faites, est très largement perdu quand ça ne fonctionne plus ; sans
parler des effets de bord signalés par Olivier.

à mon sens, mieux vaut « perdre du temps » en apprenant et en comprenant
ce qu'on fait, puisqu'au final, on acquiert des connaissances et de
l'expérience, qui... font gagner énormément de temps, et récompensent
l'effort inititial au centuple.

Enfin, c'est ma philosophie à moi que j'ai.

+1

--
Site : http://www.grenault.net
Cours photo : http://www.grenault.net/tech.htm
Home cinéma : http://www.grenault.net/homecine.htm

Le 23/03/13 20:40, alainL a écrit :

J'ai defini un <style> dans le head.
html, body {
height: 100%;
width: 100%;
overflow:auto;
background:#020501;
}


body {
font-family:Arial, Helvetica, Verdana, sans-serif;
font-size: 0.8em;

le font-size pour le body, je ne trouve pas que c'est une bonne idée ...

margin: 0;
padding: 0;
color : #CCCCCC;
}
a:link{color:#FFD700;text-decoration:underline;}

#global {

position: relative;

min-height: 100%;
width: 900px;
overflow: hidden;

Je n'ai pas IE, mais ... peut-être que cet overflow ?
(dont en fait on se demande à quoi il sert quand en fait il n'y a rien à
cacher)

margin-left: auto;
margin-right: auto;
}

</style>

Le 23/03/2013 19:16, alainL a écrit :

IE ne réagit pas comme Ffx. Je voudrais obtenir un div
"global" de 900px, centré.

http://autourdalos.fr/html/saliga130321.htm

Boudiou !!!!
- plus de 2 Mo à charger !
- images non affichées à la bonne dimension
- certaines de 1200px vues en 900px (proportionnellement)
- d'autres déformées en hauteur seulement

Merci pour vos suggestions.

<div id="global">
<p align="center">
<img width="900" height="675" alt="titre" src="../images/130321_titre.png">
</img>
</p>


Heu ...
- Pas besoin de l’attribut align dans le P
- préférez styler l'image en width:100%
(et supprimer les width et height
surtout quand ils ne sont pas appropriés)
- c'est quoi ce </img> ?




--
Stéphane Moriaux avec/with iMac-intel 27" & Mac OS X 10.6.8