Comment retirer la flèche d'un dropdown select sur webflow ?

Tutoriel
21/11/2022
3 min
Custom code pour cacher l'icône d'un select field webflow
Key points

Par défaut, lorsque vous intégrez un champ select field dans un formulaire webflow, vous avez une icône ↓ (flèche vers le bas), que "vous ne pouvez pas" supprimer.

Sauf.... si vous intégrez un petit bout de custom code 😉

Découvre dans ce tutoriel comment cacher cette icône par défaut, afin de pouvoir ajouter ton icône de dropdown 100% personnalisable.

Custom code pour cacher l'icône par défaut d'un select field webflow

  1. Ajouter un élément HTML embed code editor
  2. Intégrer le custom code css ci-dessous dedans
<style>
.w-select {    
  -webkit-appearance: none;    
  -moz-appearance: none;
}
</style>
select field webflow avec icône arrow bottom
L'icône ↓ est encore présente
Custom code pour cacher l'icône de flèche dans un select field
L'icône ↓ n'est plus présente

Et voilà ! L'icône par défaut est maintenant caché ✅

Il vous est maintenant possible d'ajouter une flèche personnalisée, créée "from scratch" depuis l'interface designer de webflow.

Florian Bodelot
Florian Bodelot
Co-fondateur

Articles qui devraient vous intéresser

Webflow Localization, cas d'utilisation de Credial
Documentation
Webflow

Webflow Localization : guide et cas pratique de Credial

Webflow Localization : guide et cas pratique de Credial
Visuel illustrant le passage de digidop.fr à digidop.com
News
Digidop

Digidop.fr devient Digidop.com

Digidop.fr devient Digidop.com
Photo de l'équipe Digidop avec Logo Digidop 2024
News
Digidop

Rétrospective d’une année 2024 exceptionnelle et cap sur 2025

Rétrospective d’une année 2024 exceptionnelle et cap sur 2025

Transformez votre site web en un moteur de croissance.

Nous contacter