probleme de css avec IE Mac

Y

yannml

Membre enregistré
18 Mars 2005
2
0
94
Salut,

Je viens de faire un site www.gelco.fr compatible IE PC, FireFox PC, Netscape MAC, Opera PC, Conqueror MAC, cependant il s’affiche pas correctement sur le IE des Macs.


Voici mes problèmes :

-J’aimerais centrer mon cadre principal au milieu de la page horizontalement (et verticalement si possible)

Bloc de code: 
.cadre { /*Conteneur du site entier*/
position: relative;
width: 700px;
height: 538px;
background-color: #000000;
margin-right: auto;
margin-left: auto;
overflow: hidden;
}

-Sur les pages société et création, le texte descriptif est trop long, alors ça empêche la photo de droite de s’afficher correctement.
Mon problème provient de la longueur du texte, les autres pages s’affichants correctement sont exactement identique niveau code.


Voici comment j'ai organisé ma page : J'ai conteneur dans lequel ce trouve a gauche une div menu-la-societe (avec du texte dedans) et de droite une div zone-photo avec donc une photo dedans.

Bloc de code: 
.contenu { /*Conteneur du contenu : sous menu et photo*/
width: 700px;
height: 452px;
overflow: hidden;
}


.menu-la-societe{
float: left;
background-color: #8A8A88;
height: 432px;
width: 156px;
padding-top: 20px;
padding-left: 10px;
padding-right: 10px;
}


.texte-la-societe{
font-family:Verdana, Arial, Helvetica, sans-serif;
color: #FFFFFF;
font-size:13px;
padding: 0px;
margin: 0px;
}


.zone-photo{
float: right;
background-color: #000000;
height: 452px;
width: 524px;
overflow:visible;
}

.photo{
position: absolute;
border: 0px;
height: 452px;
width: 524px;
}


Savez-vous quel paramètre je dois modifier ou ajouter pour rendre ce code css comptablie IE mac ?

Merci d’avance pour votre aide,

Yann
 
On le répetera jamais assez, mais IE interprête plutôt librement les css, et ce quelque soit la plateforme.
En ce qui concerne le passage de ton site sous IE mac, je crois qu'il faut arreter de se prendre la tête, la plupart des gens sous OS X sont passés sous Safari... dont acte pour les développeurs ;)
 
je ne vois ni tableau ni cellule dans ton code ??? :mouais:
voici une possibilité de code de base, à toi de le remplir..
<body>
<table width="700" border="0">
<tr>
<td colspan="2">&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td colspan="2">&nbsp;</td>
</tr>
</table>
<body>

;)
 
salut,

je te dirai comme fredmac 75, oublie IE mac
c'est deja tellement galere de gerer le model box d'IE PC que s'e****der pour IE mac qui ne represente qu'une infime partie des mac users n'est pas forcement utile

pour ce qui est du centrage vertical il faut que tu utilises des marges negatives:

essaie avec ca
.cadre { /*Conteneur du site entier*/
position: absolute;
width: 700px;
height: 538px;
background-color: #000000;
left:50%;
top:50%;
margin-left: -350px;
margin-top:-239px;

overflow: hidden;
}
 
je viens de lire l'article que tu m'as recommandé et je crois qu'il y a méprise. Dans l'article il est question de cadre ou frame (L'incroyable possibilité de subdiviser la fenêtre d'un navigateur en plusieurs fenêtres indépendantes pouvant communiquer entre elle... ) or la solution que je préconnise s'appuie sur les tableaux et les cellules qui sont la colonne vertébrale de la page web html... ;)
 
:heu: je vais crier là... Amok, je peux ?

LES <TABLE> SERVENT À ORGANISER DES DONNÉES DANS UN TABLEAU PAS À FAIRE DE LA MISE-EN-PAGE

:mad:

je sais ça se fait pas de crier mais il va y avoir de plus en plus de gens qui vont se planter en proposant des solution par <table> alors que les sociétés se tournent vers la gestion de contenu et donc une mise en page modulaire FLEXIBLE et ne veulent pas s'emmerder avec des tableaux dans des tableaux dans des cellules...
alors quand je lis ça
fredmac75 a dit:
les tableaux et les cellules qui sont la colonne vertébrale de la page web
Cliquez pour agrandir...
je vois rouge.

Ce n'est pas personnel hein que l'on soit bien d'accord

*edit*
un peu de lecture concernant le tableaux

http://openwebgroup.eu.org/articles/problemes_tableaux/
 
Nephou a dit:
:heu: je vais crier là... Amok, je peux ?

LES <TABLE> SERVENT À ORGANISER DES DONNÉES DANS UN TABLEAU PAS À FAIRE DE LA MISE-EN-PAGE
Cliquez pour agrandir...
Tiens ça c'est une excellente nouvelle :rolleyes: il va falloir que tu m'expliques la différence sybilline entre organiser des données et mettre en page pour le web. La seconde proposition étant le résultat de la première
Nephou a dit:
je sais ça se fait pas de crier mais il va y avoir de plus en plus de gens qui vont se planter en proposant des solution par <table> alors que les sociétés se tournent vers la gestion de contenu et donc une mise en page modulaire FLEXIBLE et ne veulent pas s'emmerder avec des tableaux dans des tableaux dans des cellules...
Cliquez pour agrandir...

Que les gens ne veulent pas s'emmerder avec les tableaux c'est une chose... que les tableaux soient la colonne vertébrale de la page web s'en est une autre.
Pour ce qui est de la gestion de contenu, il faut bien avoir en tête de quels types de sites l'on parle. Certainement que les production auxquelles tu penses ont plusieurs dizaines ou centaines de pages, ce qui n'est pas le cas de tous les sites... ;)
 
Héliotrope a été plus claire que moi en parlant de données tabulaires.

Un tableau sert à reproduire un tableau : résultats, feuille de match, note du premier semestre, comparatif...

Une pages internet c'est deux choses : un structure définie par des balises signifiantes (heading, emphasize, paragraph, table) et une interprétation représentative de ce document. En utilisant un tableau on casse totalement la structure du document (regarde ta page avec un navigateur texte pour voir) et on le rend inaccessible à pas mal de personnes.
 
sorry, je me suis trompé de reference c'estmauvais liens mais j'abonde ds le sens de nephou
ici --> http://www.cybercodeur.net/weblog/presentations/seybold/09redesigns.html

les TABLES sont à bannir !!!!!
c'est la cata à maintenir, en plus le code n'est pas signifiant à la lecture
aujourd'hui le but est de structurer intelligement le contenu de l'html sans CONDITIONS DE FORMES
pour ça il y a les feuilles de style

je pense que tu sous-estimes la puissance du couple XHTML/CSS d'autant que le recours au tableaux correspond désormais à la préhistoire du web quand c'etait la seule facon de contourner les limitations en terme de mise en page des navigateurs


en plus va presenter sur un terminal wap ta mise en page en tableau --> un media = une feuille de style
;-)
 
  • J’aime
Réactions: Nephou
Nephou a dit:
Pour répondre : pour le centrage c'est un vieux truc :

tu ajoutes dans ta feuille le sélecteur body avec l'attribut text-align:center et tu rétablies l'alignement à gauche dans ta div .cadre
Cliquez pour agrandir...

Là tu parle de l'alignement du texte or la question était :

J'aimerais centrer mon cadre principal au milieu de la page horizontalement (et verticalement si possible)

C'est à dire l'alignement du tableau ou une cellule (et oui encore eux).
Pour répondre à la question :

<table width="100%" border="0">
<tr>
<td><table width="700" border="0" align="center">
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
</table></td>
</tr>
</table>

Ceci est une proposition et ce n'est certainement pas la seule. A toi de voir celle qui te convient... ;)
 
si tu affectes text-align à body cela signifie que le contenu de body est centre (tt type de contenu et non pas le texte) cad ton div se retrouve au centre
le hic c'est que du coup le div herite du text-align center alors tu corriges en mettant left

question : avec ton table .... comment tu fais pour corriger ta largeur ss te palucher toutes les pages si ton client decide que 720 c'est mieux

avec les css -> un seul fichier à modifier = gain de temps et d'argent

penses y surtout si tu exerce dans le secteur

p.S: le code que j'ai donné centre horizontalement et verticalement
 
heliotrope a dit:
sorry, je me suis trompé de reference c'estmauvais liens mais j'abonde ds le sens de nephou
ici --> http://www.cybercodeur.net/weblog/presentations/seybold/09redesigns.html

les TABLES sont à bannir !!!!!
c'est la cata à maintenir, en plus le code n'est pas signifiant à la lecture
aujourd'hui le but est de structurer intelligement le contenu de l'html sans CONDITIONS DE FORMES
pour ça il y a les feuilles de style

je pense que tu sous-estimes la puissance du couple XHTML/CSS d'autant que le recours au tableaux correspond désormais à la préhistoire du web quand c'etait la seule facon de contourner les limitations en terme de mise en page des navigateurs
;-)
Cliquez pour agrandir...

J'utilise des templates associés aux CSS sous Dream et la "maintenance" ne me pose pas plus de problème que cela (ce qui ne signifie pas qu'il n'y a pas de problème ...) ;)

heliotrope a dit:
le code n'est pas signifiant à la lecture
Cliquez pour agrandir...
Et bien va raconter ça à ton client...

heliotrope a dit:
en plus va presenter sur un terminal wap ta mise en page en tableau --> un media = une feuille de style
Cliquez pour agrandir...
Encore faut-il en avoir l'utilité (ce qui n'est pas le cas de la majorité des sites) ou que le client en est fait la demande expresse.

Globalement vous avez sans doute raison, mais la techno pour la techno ne m'intéresse pas. Je ne l'utilise que lorsque cela est nécessaire ou pour moi, ou pour le client... ;)
 
des templates ....
je vois pas en quoi c'est une solution

cas 1: site avec peu de page pas de relation avec une DB -> ton template te sert à nada
tu dois refaire ttes les pages concernées.

cas 2: site dynamique -> la t'as un peu plus de chance il te suffit de modifier la partie du code à revoir
toutefois faut esperer que t'es codé tt ca bien proprement pour que tu n'es qu'un header à modifier


ceci dit libre à toi de choisir ta facon de bosser
 
Nephou a dit:
*edit*
un peu de lecture concernant le tableaux

http://openwebgroup.eu.org/articles/problemes_tableaux/
Cliquez pour agrandir...

Relis donc bien l'article :
Il est important de noter qu'il ne faut pas bannir les tableaux pour autant. Ils remplissent parfaitement leur rôle quand il s'agit de structurer des données. Voir à ce sujet l'article intitulé Habillage des tableaux en CSS.
Etant entendu que des données peuvent être des images, du textes, etc... ;)
 
heliotrope a dit:
des templates ....
je vois pas en quoi c'est une solution

cas 1: site avec peu de page pas de relation avec une DB -> ton template te sert à nada
tu dois refaire ttes les pages concernées.

cas 2: site dynamique -> la t'as un peu plus de chance il te suffit de modifier la partie du code à revoir
toutefois faut esperer que t'es codé tt ca bien proprement pour que tu n'es qu'un header à modifier

ceci dit libre à toi de choisir ta facon de bosser
Cliquez pour agrandir...
Si j'utilise des templates c'est justement pour éviter d'avoir à refaire toutes les pages ; c'est même l'intérêt des templates ; on modifie l'original est toutes les pages liées sont modifiées ... ;)
Cette solution marche de pair avec des "régions modifiables".

Néanmoins tu as raison. Cela suppose un codage nickel ; dans ce cadre, il n'y a pas d'à peu près.
 
tu persistes dans l'erreur ;-)

un truc pour justifier le recours aux css:
hypothese: un site de 20 pages avec une structure identique


--> ton code

<table width="100%" border="0">
<tr>
<td><table width="700" border="0" align="center">
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
</table></td>
</tr>
</table>

avec ton code : 182 caracteres espaces compris * 20 = 3640 caracteres

avec le mien :
css -> identique 182 (marrant ça) avec un commentaire et d'avantage de customisation
.cadre { /*Conteneur du site entier*/
position: absolute;
width: 700px;
height: 538px;
background-color: #000000;
left:50%;
top:50%;
margin-left: -350px;
margin-top:-239px;
overflow: hidden;
}

--> html
23 caracteres
<div id ="cadre"></div>

total pour mes 20 pages -> (23* 20) + 182 = 642

c'est autant d'espace serveur et de bande passante d'economiser.
 

Sujets similaires

phcm64100
CSS : Mettre une image a droite
Réponses
6
Affichages
274
Développement web
phcm64100
phcm64100
balance
code CSS
Réponses
1
Affichages
4K
Développement web
momo-fr
momo-fr
Morebany
[HTML5]jouer/stopper/rejouer... sa webcam
Réponses
1
Affichages
2K
Développement web
Morebany
Morebany
benG
Mail : signature HTML
Réponses
1
Affichages
2K
Web et e-mail
julienboost
J
symbol
scrolling qui coupe le texte
Réponses
2
Affichages
1K
Développement web
symbol
symbol
Haut Bas