Skip to main content Help Control Panel

 

support «   Soupçons de bogues «  

bug d'affichage dans la 7.12 [Solved]

nath -- on Jan. 1 2008

boutons

WorkflowSupport request
StatusA solution has been made available
Owner nath
Progress80%

Certains boutons sont disproportionnés et n'ont pas le look aqua et ce sur IE6 WinXP et Safari MAC OSX.5 (leopard).

Parfois, les boutons "aqua" apparraissent avec un fond différent du fond de la page (ex : fond de page blanc et fond de bouton bleuté, donc intégration bof bof)

Files

Bouton sous winXP IE6.jpg - 8,328 bytes, 198 downloads
edited by Macnana on Jan. 8 2008 · details
Button drop.gif - 3,227 bytes, 240 downloads
edited by ThierryP on Jan. 3 2008 · details

Comments


Pinelli, Thierryfrom Nice, Drap
Associate, 1740 posts

on Jan. 2 2008

Bonsoir,

Tu as noté un bug ici ou sur un autre serveur ?

J'ai noté quelques erreurs avec Opéra, mais rien qui ne se répare pas en modifiant le css...

(tiens, le bouton Aperçu n'est pas pris en compte par le disgn aqua...)

SEO et webmastering VDP-Digital - Skins pour Yacs : Yordpress

Communiqués de Presse : Site de Communiqués de Presse à propulsion Yacs -
Création de sites, Référencement et webmastering - Skins pour Yacs : YordPress - Yacs couleurs Wordpress - Bonbon Skin 1.3.2 : Le graphisme "Green" - Totem 930 : L'équilibre pour petits écrans

nath
352 posts

inspired from ThierryP on Jan. 3 2008

ThierryP :

Ici, sur IE6, j'ai un encadré bleu ciel autour des bouton aqua.

sur mon site en YordPress, les boutons sont énormes et type windows 98 sous safari (osx.5) et IE6 (Win XP)

Suis pas une base en CSS :(


Pinelli, Thierryfrom Nice, Drap
Associate, 1740 posts

on Jan. 3 2008

Pour le cadre bleu autour du bouton avec IE6 c'est hélas normal, ce navigateur ne gérant pas les fichiers .png (PNG24) du coup, au lieu d'afficher la transparence, il affiche un contour bleuté bien inesthétique...

Une solution consiste à changer le fichier qui gère le bouton (button_drop.png) en gif... (voir fichier joint) Par contre, l'affichage ne sera parfait que sur fond blanc...

Pour Yordpress, la version 5.2 qui prend en charge les boutons aqua est en cours (commencé hier :p )

SEO et webmastering VDP-Digital - Skins pour Yacs : Yordpress


button-drop.gif

Communiqués de Presse : Site de Communiqués de Presse à propulsion Yacs -
Création de sites, Référencement et webmastering - Skins pour Yacs : YordPress - Yacs couleurs Wordpress - Bonbon Skin 1.3.2 : Le graphisme "Green" - Totem 930 : L'équilibre pour petits écrans

Bernard Paquesfrom nearby-an-airport
Associate, 8408 posts

on Jan. 7 2008

J'ai aussi Safari sous Mac OSX 10.5, et je n'ai pas vu de problème particulier avec les boutons "aqua". Tu aurais une page exemple à me mettre sous la dent ?

nath
352 posts

on Jan. 7 2008

Bernard : bouton

 

je crois que c'est un soucis de css

j'ai le même genre d'affichage au boulot sur IE6 winXP pour certains boutons.

 

screenshot demain car pas de boulot aujourd'hui pour cause de grève de transport en commun :( 


Pinelli, Thierryfrom Nice, Drap
Associate, 1740 posts

on Jan. 7 2008

Il faut que tu ajoute ces lignes dans ton css : 

#main_panel a.button { /* a link that mimic a form button -- [button]url[/button], [button=label]url[/button] */  
    display: -moz-inline-box; /* mandatory for firefox 2 */
    display: inline-block;
    cursor: pointer;
    border: none;
    font-size: 0;
    font-style: normal;
    text-decoration: none;
    color: #2e523b;
    line-height: 0;
    background: transparent url('images/button_drop.gif') 0 0 no-repeat;
    height: 30px;
    margin: 0 6px 0 0;
    padding: 0 10px 0 0;
    vertical-align: middle;
}

#main_panel a.button span {
    display: inline-block;
    cursor: pointer;
    border: none;
    font-family: "Arial" !important;
    font-size: 12px !important;
    font-style: normal;
    white-space: nowrap;
    letter-spacing: 0 !important;
    color: #222;
    line-height: 16px;
    background: transparent url('images/button_drop.gif') 100% 0 no-repeat;
    height: 30px;
    margin: 0 -16px 0 10px;
    padding: 8px 20px 0 10px;
    vertical-align: middle;
}


#main_panel span.button { /* a button in a form */
    display: -moz-inline-box; /* mandatory for firefox 2 */
    display: inline-block;
    cursor: pointer;
    border: none;
    font-size: 0;
    font-style: normal;
    text-decoration: none;
    color: #2e523b;
    line-height: 0;
    background: transparent url('images/button_drop.gif') 0 0 no-repeat;
    height: 30px;
    margin: 0 6px 0 0;
    padding: 0 13px 0 0;
    vertical-align: middle;
}

#main_panel span.button button {
    display: -moz-inline-box;
    display: inline-block;
    cursor: pointer;
    border: none;
    font-family: "Arial" !important;
    font-size: 14px !important;
    font-style: normal;
    white-space: nowrap;
    letter-spacing: 0 !important;
    color: #222;
    line-height: 2em; /*Higt value for Opera 9.0 compatibility*/
    background: transparent url('images/button_drop.gif') 100% 0 no-repeat;
    height: 30px;
    margin: 0 -16px 0 10px;
    padding: 0 20px 0 10px; 
    vertical-align: text-top;
}

#main_panel a.button:hover,
#main_panel span.button:hover {
    background-position:0 -60px;
    color:#fff;
    text-decoration:none;
}

#main_panel a.button:hover span,
#main_panel span.button:hover button {
    background-position:100% -60px;
    color:#fff;
}

#main_panel a.button:active span,
#main_panel span.button:focus button {
    color:#444;
}


En plus du fichier image pour le bouton aqua...

Ca devrait tourner comme sur des boutonettes,
non ?

SEO et webmastering VDP-Digital - Skins pour Yacs : Yordpress

Communiqués de Presse : Site de Communiqués de Presse à propulsion Yacs -
Création de sites, Référencement et webmastering - Skins pour Yacs : YordPress - Yacs couleurs Wordpress - Bonbon Skin 1.3.2 : Le graphisme "Green" - Totem 930 : L'équilibre pour petits écrans