Reprise du message précédent :
Wrong topic
 
J'ai une liste, toujours en inline, et à chaque élément de la liste j'ai un background qui est en fait une bordure droite.
J'aimerai que le background descende de 2px sans que le texte suive.
J'ai essayé à coup de margin et padding, mais à chaque fois le texte suit.
Si je joue avec background-position ça ne fait que tronquer ma bordure.

 
sur un projet, on à une appli flash qui est une sorte de wysiwyg pour ajouter du texte, des images, les mettres en forme, à la fin on sauvegarde tout en bdd (chaque element, ses coordonnées x,y, taille, police, ...)
 
et de mon coté, je regenere un png avec gd tiré des infos bdd,  
 
aucun soucis pour le moment, sauf la rotation de texte (polices ttf avec gd), sur ce point gd est buggé, il decale les caracteres, pas moyen de patcher correctement pour avoir le rendu parfait (voir doc de imagettfbox() chez php.net)
 
pas moyen non plus de taper le texte droit avec gd, puis pivoter, c'est tout aliasé,
en grossissant par 4 la taille du texte, en pivotant, et en reduisant de 4 l'image, le serveur prends 3 plombes, pas possible comme ca non plus donc,  
 
je viens de penser à image magik, je n'y ai jamais touché,  
que vaut-il face à gd ? je dois gerer des rotations, des alpha, sur du png.
 

Bah fait du Cross-Browser inline-block

 
J'ai fait du block tout cours

inline-block c'est le top, ça marche sous IE8, FF3, Chrome, Safari, Opera RAP de IE6 et 7

 
Content que tu puisses t'en passer.

C'est quoi la technique pour appliquer un background à une image (j'ai des images rectangulaires à la base et je veux les passer en dessous d'un background transparent avec une bordure aux coins arrondis.
 
J'y arrive, mais c'est relativement crade, j'ai un div vide, juste en dessous un autre div qui contient mon image, tous les deux en position absolue et avec un z-index plus faible pour la div contenant l'image.

Bha c'est comme ca oui .. en gros
 
D'ailleurs tu veux pas appliquer un "background" à une image.. mais un "foreground" donc pas trop le choix.

Content aware fill powa
Original :

Resultat en 20 minutes de tests

Fait avec le plugin Alien Skin Image Doctor 2 de Toshop, en attendant le Content Aware Fill de CS5

 
Génial, déchirer les photos après le divorce c'était plus trop possible en numérique, maintenant si
 
(et couplé à l'autotag de certaines libs de photo, en 3 clicks tu supprime quelqu'un de ta bibliothèque )

Faut quand meme du boulot, car faut bien contourer le bordel et bien sélectionner par quoi tu vas le remplacer. Sous Gimp  sous nux et windows il y a le plugin resynthesizer qui fait ça à merveille. C'est quand même assez utile quand tu veux enlever un truc chiant sur une tof.

 
En fait y a "mieux" :
 

<div class="image">
    <div class="frame_image"></div>
        <img src="test.gif" alt="" />
    </div>
</div>

.image {
    z-index: 10;
    position: relative;
    width:88px;
    height:57px;
}
.frame_image {
    background: url('../gfxframe.gif') no-repeat;
    width: 88px;
    height: 57px;
    z-index: 100;
    position: absolute;
}

 
J'ai vu une démo et c'est vraiment impressionnant  
 

 
Clair, avant j'y allais à coup de tampons, mais ça prenait un temps fou.

Là c'est encore plus simple, tu contours la personne à enlever, tu choisis content Fill (plugin alien image doctor 2), et ensuite je mets pas le mode auto car parfois à chier, mais le mode manuel et la magie s'opère

 
Oui en fin bon.. le principe est le même.. t'avais l'air de demander une solution miracle genre en css ..

 
Bah j'aurais bien aimé faire un truc du genre :
 

<div id="cadre">
    <img src="monimage.gif"/>
</div>

J'arrive pas à remonter la valeur d'un input button ou submit

En js, il y a moyen de récupérer les instances d'une classe/prototype?
 
genre new Foo(); new Foo(); new Foo(); magic_here(Foo) => renvoie 3 instances de Foo, si elles ont pas encore été collectées anyway?

Hum, à moins de faire un truc sale ( et encore, ce à quoi je pense n'est pas sur de fonctionner ), pas à ma connaissance.

Edith :

var instances = [];
 
var Foo = function(){
    instances.push(this);
};
 
var Bar = function(){
    instances.push(this);
};
 
function magic_here(klass) { 
    return instances.filter(function(instance) {
        return instance.constructor == klass;
    });
}
 
new Foo(); new Foo(); new Foo(); new Bar();
 
magic_here(Foo) // [Foo, Foo, Foo]

Edith2 : Et elle ne seront pas collectées tant que tu ne le fais pas de manière explicite

 
autoreponse : j'ai recalculé mes bounding box à la main (ouch la trigo, c'etait loin pour moi ), en alignant le texte sur la ligne du bas (genre celle du p,y,j, ...), et ca marche

C'est possible via les selecteurs CSS de ne pas appliquer un style à l'élément enfant :

#redactor a {
 background: url('../gfx/menu_redactor.gif') #479600 no-repeat;
}

<li id="redactor">
   <a href="#">ahah</a>
   <ul>
      <li><a href="#">ohoh</a></li>
   </ul>
</li>

En gros le background s'applique à ahah mais pas à ohoh

Tant qu'on est dans l'objet JS :

Ya un moins d'avoir un instanceof qui marche avec l'héritage (héritage simulé par Mootools, par ex) ?
Ou un truc qui jouerait le même rôle ?

Genre

Foo = new Class({
  
});
Bar = new Class({
  Extends: Foo
});
var obj = new Bar();
 
alert(obj instanceof Foo); // 1

<li id="redactor">
   <a href="#">ahah</a>
   <ul>
      <li><a href="#">ohoh</a></li>
   </ul>
</li>

http://www.w3.org/TR/CSS2/selector.html
 
+

Foo = new Class({
  
});
Bar = new Class({
  extends: Foo
});
var obj = new Bar();
 
alert(obj instanceof Foo); // 1

C'est Extends, pas extends
 

Justement, j'ai déjà essayé > et +, mais ça ne fait pas ce que je veux (il y a de fortes chances que je le fasse mal cela dit
 

<ul id="tab">
    <li class="account">
        <a href="#">Compte</a>
        <ul>
            <li><a href="">Lien</a></li>
            <li><a href="">Lien</a></li>
            <li><a href="">Lien</a></li>
        </ul>
    </li>
</ul>

#tab li > a {
    text-indent: -9999px;
    display: block;
    float: left;
    width: 144px;
    height: 29px;
    margin: 0 0 2px 7px;
}

 
J'aimerai que le style ne soit appliqué qu'au premier lien suivant le li avec la classe "account".
On ne peut pas se baser sur cette classe, j'ai juste pris un bout du html il y a plusieurs onglets dans mon menu et donc des noms de class/id différents.
 
Après j'ai toujours la solution de mettre une classe genre "first_link" à tous mes li précédant les liens que je veux styler, mais j'aurais aimé le faire uniquement avec les selecteurs.

Bon alors non
 
Tant pis, je ferais autrement, merki

<ul id="tab">
    <li class="account">
        <a href="#">Compte</a>
        <ul>
            <li><a href="">Lien</a></li>
            <li><a href="">Lien</a></li>
            <li><a href="">Lien</a></li>
        </ul>
    </li>
</ul>

#tab li > a {
    text-indent: -9999px;
    display: block;
    float: left;
    width: 144px;
    height: 29px;
    margin: 0 0 2px 7px;
}

#tab > li > a {
    
}

Et ouais y'a pas de __del__ en js, du coup pas moyen de continuer sur ma lancée dégueulasse.
Mais tu veux faire quoi au juste?

#tab > li > a {
    
}

 
Merci

Oublie pas que ça ne fonctionne pas sous IE6, si c'est vraiment important. Au pire fout une classe et pis voilà

Sous quoi?

Sous Windows, évidemment
 
 
 
 
 
 
 
 

 
C'était bien la peine de passer 1h à chercher
Merci de la précision.
 

 
Quel diff entre #tab li a et #tab > li > a ?

Le contenu de ce message a été effacé par son auteur

Je suis désolé je comprends pas la différence :s

Le contenu de ce message a été effacé par son auteur

Ah ok, en gros dans le premier cas, si F est dans M ça marche, dans le deuxième non c'est ça ?

Maintenant que j'ai mon menu déroulant qui fonctionne en CSS, je passe à jQuery (ils voulaient pas s'occuper des users n'ayant pas js, heureusement que je suis là ).

Voici mon script :

$(document).ready(function() {
    $("#tab > li" ).hover(function() {
        $(".submenu", this).slideDown('slow').show();
    },
    function() {
        $(".submenu" ).slideUp('slow').hide();
    });
});

Il fonctionne, sauf qu'au premier passage de la souris sur un élément faisant dérouler le sous-menu, les effets ne sont pas pris en compte et la css prend le relai (le sous menu apparait directement).
Ca ne se produit qu'une seule fois sur la page, et si ça s'est produit sur le premier lien je n'aurai pas ce problème sur le second par exemple.

Le contenu de ce message a été effacé par son auteur

$(document).ready(function() {
    $("#tab > li" ).hover(function() {
        $(".submenu", this).slideDown('slow').show();
    },
    function() {
        $(".submenu" ).slideUp('slow').hide();
    });
});

 
Ca sent le css mal initialisé au chargement de la page (et corrigé par le js au premier hover)
 
verifie tes display:nonez ou visibility:hidden