Coins ronds transparents étirables ?

Coins ronds transparents étirables ? - HTML/CSS - Programmation

Marsh Posté le 08-06-2004 à 23:46:40    

Il y a sur la page d'accueil de http://www.macromedia.com des coins ronds transparents. Ces coins sont une image de taille fixe, une en haut, une en bas, chacune contenant un coin gauche, le haut/bas du bloc, un coin droit. Y'a t-il moyen de rendre ce bloc étirable ? (taille en %)  
 
J'ai beau chercher, je vois pas comment faire sans table, ou alors peut-être avec des positionnements absolutes crados.  
 
:??:

Reply

Marsh Posté le 08-06-2004 à 23:46:40   

Reply

Marsh Posté le 08-06-2004 à 23:57:43    

Salut,
 
jette un oeil ici :
 
http://www.alsacreations.com/articles/
 
10eme et 11eme ligne du menu.
 
++
 
L.

Reply

Marsh Posté le 09-06-2004 à 00:01:59    

Hélas, ça marche pas avec des coins transparents.

Reply

Marsh Posté le 09-06-2004 à 10:48:20    

up !

Reply

Marsh Posté le 09-06-2004 à 11:46:25    

youdontcare a écrit :

Hélas, ça marche pas avec des coins transparents.


Ah bon et pourquoi ça ?
Il suffit d'utiliser des gifs transparents, la technique reste exactement la même.


---------------
www.polychromies.com (Portfolio) - www.photographier-bebe.com (livre photo de bébé) - www.alsacreations.com
Reply

Marsh Posté le 09-06-2004 à 12:27:10    

SIBELIUS a écrit :

Ah bon et pourquoi ça ?
Il suffit d'utiliser des gifs transparents, la technique reste exactement la même.

http://www.alsacreations.com/articles/tutocss2/cap.gifSi 'hautd' est transparent, on verra le 'haut' étiré derrière.

Reply

Marsh Posté le 09-06-2004 à 12:31:18    

youdontcare a écrit :

http://www.alsacreations.com/articles/tutocss2/cap.gifSi 'hautd' est transparent, on verra le 'haut' étiré derrière.


C'est vrai. Dans ce cas, il suffit de séparer "haut" et "hautd" (ne pas les imbriquer comme c'est la cas)
Sinon, tu as toujours la 2ème méthode qui peut t'aider.


---------------
www.polychromies.com (Portfolio) - www.photographier-bebe.com (livre photo de bébé) - www.alsacreations.com
Reply

Marsh Posté le 09-06-2004 à 12:41:07    

SIBELIUS a écrit :

C'est vrai. Dans ce cas, il suffit de séparer "haut" et "hautd" (ne pas les imbriquer comme c'est la cas)

Ah, effectivement. Par contre j'ai un espace entre les 2 blocs sous ie, que je n'arrive pas à gicler.
 

SIBELIUS a écrit :

Sinon, tu as toujours la 2ème méthode qui peut t'aider.

Non, elle n'est pas étirable.

Reply

Marsh Posté le 09-06-2004 à 12:49:36    

youdontcare a écrit :


Non, elle n'est pas étirable.


Pas étirable en largeur, non.


---------------
www.polychromies.com (Portfolio) - www.photographier-bebe.com (livre photo de bébé) - www.alsacreations.com
Reply

Marsh Posté le 09-06-2004 à 12:54:51    

SIBELIUS a écrit :

Pas étirable en largeur, non.

C'est précisément le sens qui m'intéresse :D
 
//
 
L'espace sous ie fait 3 pixels, ça donc l'air d'être http://www.positioniseverything.ne [...] xtest.html . J'ai rajouté un margin-left: -3px sur hautd, j'ai un résultat correct sous ie & firefox, mais la méthode me déplait franchement. Rien de mieux ?

Reply

Marsh Posté le 09-06-2004 à 12:54:51   

Reply

Marsh Posté le 09-06-2004 à 13:27:52    

youdontcare a écrit :

C'est précisément le sens qui m'intéresse :D
 
//
 
L'espace sous ie fait 3 pixels, ça donc l'air d'être http://www.positioniseverything.ne [...] xtest.html . J'ai rajouté un margin-left: -3px sur hautd, j'ai un résultat correct sous ie & firefox, mais la méthode me déplait franchement. Rien de mieux ?

avec align et valign, ça ne marche pas ?  :??:

Reply

Marsh Posté le 09-06-2004 à 13:53:34    

misterpinguin a écrit :

avec align et valign, ça ne marche pas ?  :??:

Comment ça ?

Reply

Marsh Posté le 09-06-2004 à 14:05:04    

Pour les 3 pixels il faut aussi jouer avec font-size:0px; et retirer tous (ou du moins certains) les espaces et sauts de lignes entre les balises ...

Reply

Marsh Posté le 09-06-2004 à 15:34:22    


<td valign=top align=right><img.....
pour avoir ton coin en haut a droite ?

Reply

Marsh Posté le 09-06-2004 à 16:43:47    

ya aussi l'attribut -moz-border-radius qui évite l'utilisation d'image :)
http://linuxfr.org/~kaiska/13517.html

Reply

Marsh Posté le 09-06-2004 à 16:49:13    

fxoxo a écrit :

Pour les 3 pixels il faut aussi jouer avec font-size:0px; et retirer tous (ou du moins certains) les espaces et sauts de lignes entre les balises ...

Déjà fait, et les 2 balises se touchent. J'ai toujours l'espace.

Reply

Marsh Posté le 09-06-2004 à 16:49:41    

misterpinguin a écrit :

<td valign=top align=right><img.....
pour avoir ton coin en haut a droite ?

J'aimerais une solution sans table, mais a priori je ne vais pas y couper.

Reply

Marsh Posté le 09-06-2004 à 16:50:05    

bobuse a écrit :

ya aussi l'attribut -moz-border-radius qui évite l'utilisation d'image :)
http://linuxfr.org/~kaiska/13517.html

Et je veux que ça marche le plus partout possible :D

Reply

Marsh Posté le 09-06-2004 à 17:52:23    

accessoirement si tu es dans une table, tu peux ajouter ces parametres :
<table cellspacing=0 cellpadding=0 ...>
 
ça permet de coller les cellules entre elles sans aucun espace
/me use it


---------------
dieu créa l'homme et meuh fit la vache
Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed