Bonjour,
J'ai un petit souci.
J'ai mon propre site internet : http://www.thomashamon.com/2008/ (tournant sous Wordpress)
L'affichage est géré par les CSS et tout fonctionne à merveille sous Firefox, IE et Opéra.
Cependant, j'ai un bug d'affichage avec Safari pour Mac. La plupart des liens sont affichés avec les couleurs d'origine (c'est à dire BLEU) et non pas par le code CSS qui doit les afficher en ORANGE.
Pour se rendre compte du problème, essayez d'ouvrir la page avec Safari puis Firefox ou IE pour voir.
Quelqu'un connaît-il la solution à mon problème ? D'avance merci.
Le code CSS d'affichage : (mauvais affichage sur a, h2, etc)
a {
color : #ff7800;
text-decoration : none;
}
a:hover {
color : #ff7800;
text-decoration : underline;
}
acronym, abbr {
cursor : help;
}
blockquote {
border-left : 3px solid #ededed;
margin-left : 15px;
padding-left : 5px;
}
body {
background : url("images/background.jpg") fixed;
color : #333;
font-size : 62.5%;
font-family : 'Lucida Grande', Verdana, Arial, Sans-Serif;
margin : 0 auto;
padding : 0;
text-align : center;
}
cite {
font-size : 90%;
font-style : normal;
}
h2 {
font-size : 12px;
margin : 0 0 6px 0;
padding : 3px 0 3px 5px;
font-weight : bold;
color : #ff7800;
background : url("images/title.jpg") no-repeat;
}
h2 a {
color : #ff7800;
text-decoration : none;
}
h2 a:hover {
color : #ff7800;
text-decoration : underline;
}
h3 {
font-size : 120%;
margin-top : 0;
}
h4 {
font-size : 12px;
margin : 0 0 6px 0;
padding : 3px 0 3px 5px;
font-weight : bold;
color : #000000;
border-bottom : 1px dotted #3d3d3d;
background : url("images/titleh4.jpg") no-repeat;
}
img {
padding : 0;
border : none;
}
img.alignleft {
float : left;
margin : 0 0 0 0;
}
img.alignright {
float : right;
margin : 0 0 0 0;
}
li {
margin : 0;
padding : 0;
list-style-type : none;
}
ol#comments li p {
font-size : 100%;
}
ul {
margin : 0;
padding : 0;
}
#ad1 {
text-align : center;
}
#ad2 {
text-align : right;
padding-right : 40px;
height : 100%;
}
.description {
float : right;
padding : 3px 650px 0 0;
color : #886c45;
font-size : 11px;
text-decoration : none;
font-family : Verdana;
font-weight : normal;
}
.feedback {
color : #ccc;
text-align : right;
margin-bottom : 15px;
padding-right : 15px;
clear : both;
background : #ededed;
text-transform : lowercase;
}
.feedback a {
text-decoration : none;
background : #ffffff;
padding : 3px 10px 3px 10px;
border : 1px solid #ededed;
}
.feedback a:hover {
text-decoration : underline;
background : #ffffff;
padding : 3px 10px 3px 10px;
border : 1px solid #ededed;
}
.feedback a:visited {
text-decoration : none;
background : #ffffff;
padding : 3px 10px 3px 10px;
border : 1px solid #ededed;
}
.feedback a:visited:hover {
text-decoration : underline;
background : #ffffff;
padding : 3px 10px 3px 10px;
border : 1px solid #ededed;
}
.post {
background : #ffffff;
height : 100%;
border : 1px dashed lightgray;
}
.post2 {
background : #ffffff;
height : 400px;
border : 1px dashed lightgray;
}
.post3 {
background : #ffffff;
height : 600px;
border : 1px dashed lightgray;
}
.spacer {
padding-bottom : 10px;
text-align : right;
clear : both;
text-transform : lowercase;
}
.meta {
font-size : 0.9em;
}
.meta li, ul.post-meta li {
display : inline;
}
.meta ul {
display : inline;
list-style : none;
margin : 0;
padding : 0;
}
.meta {
color : #555;
font-weight : normal;
letter-spacing : 0;
padding-left : 5px;
}
.storycontent {
font-size : 115%;
padding-left : 10px;
padding-right : 10px;
}
#commentform {
padding-left : 6px;
}
#commentform #author, #commentform #email, #commentform #url, #commentform textarea {
background : #ffffff;
border : 1px solid #e1e1e1;
color : #333;
padding-left : 2px;
}
#commentform textarea {
width : 98%;
}
#commentlist li ul {
border-left : 1px solid #ededed;
font-size : 110%;
}
ol#commentlist li {
list-style : decimal;
}
#content {
width : 600px;
margin : 5px 0 0 265px;
text-align : justify;
}
#content ol li {
list-style : decimal;
}
#content ul {
margin-top : 10px;
margin-left : 35px;
}
#content ul li {
list-style-image : none;
}
#content-big {
float : left;
width : 575px;
margin : 0 8px 20px 8px;
text-align : justify;
}
#menu {
text-align : left;
font-family : 'Lucida Grande', Arial;
font-size : 8pt;
padding-left : 40px;
}
#search {
float : right;
}
#menu a {
color : #ff7800;
text-decoration : none;
}
#menu a:hover {
color : #ff7800;
text-decoration : underline;
}
#menu a:visited {
color : #ff7800;
text-decoration : none;
}
#menu a:visited:hover {
color : #ff7800;
text-decoration : underline;
}
#header {
font-size : 33px;
font-weight : bold;
text-decoration : none;
font-family : Verdana;
margin : 0 auto;
height : 195px;
width : 900px;
padding : 0;
background : url("images/header.jpg");
}
.header-title {
font-family : 'Lucida Grande', Verdana, Arial, Sans-Serif;
color : #fcb300;
font-size : 28px;
font-weight : bold;
padding : 165px 0 0 328px;
text-align : left;
}
.header-title a {
color : #ff7800;
text-decoration : none;
border-bottom : none;
}
.header-title a:hover {
color : #ff7800;
text-decoration : underline;
border-bottom : none;
}
.header-description {
font-size : 11px;
font-family : 'Lucida Grande', Verdana, Arial, Sans-Serif;
font-weight : normal;
color : #eeeeee;
padding : 0 0 0 329px;
text-align : left;
}
#footer {
width : 900px;
height : 90px;
margin : 0 auto;
color : #eeeeee;
background : url("images/footer.jpg") no-repeat;
border-left : 3px solid #262626;
border-right : 3px solid #262626;
}
#footer a {
color : #ff7800;
text-decoration : none;
}
#footer a:hover {
color : #ff7800;
text-decoration : underline;
}
#footer a:visited {
color : #ff7800;
text-decoration : none;
}
#footer a:visited:hover {
color : #ff7800;
text-decoration : underline;
}
#menu-left {
float : left;
padding : 0px 10px 0px 35px;
width : 210px;
font-size : 11px;
border-right : 2px dotted #ededed;
display : inline;
}
#menu-left a, #menu-left a:visited {
text-decoration : none;
color : #ff7800;
}
#menu-left a:hover, #menu-left a:visited:hover {
color : #ff7800;
text-decoration : underline;
}
#menu-left ul ul {
padding-bottom : 10px;
margin-left : 15px;
}
#menu-left ul ul li {
list-style-image : url("images/icon.gif");
margin-left : 5px;
}
.rss {
width : 220px;
background : url("images/rss.jpg") no-repeat;
}
#rap {
width : 900px;
margin : 0 auto;
background : url("images/main.jpg") repeat-y;
text-align : left;
border-left : 3px solid #262626;
border-right : 3px solid #262626;
}
Afficher la suite
17 mars 2009 à 21:29
J'ai finalement fixé le problème.
j'ai remplacé par ce que tu m'as dit mais à première vue, il ne s'est passé aucun changement. J'ai eu une idée.
La page qui appelait le lien était du genre un bloc avec ce genre de syntaxe :
<div class="post"> </div>
que j'ai changé par <div id="post"> </div>
et dans le css le
.post a:link {
color : #ff7800;
text-decoration : none;
}
par
#post a:link {
color : #ff7800;
text-decoration : none;
}
et ça fonctionne nickel. Au top sous SAFARI, firefox, IE et Opéra !