Nico’s dreams - Commentaires du blog de Nicolas Hoffmann https://www.nicolas-hoffmann.net/rss/commentaires.php fr-fr 120 Nico’s dreams - Commentaires du blog de Nicolas Hoffmann https://www.nicolas-hoffmann.net/rss/nicos_dreams.jpg https://www.nicolas-hoffmann.net/rss/commentaires.php Commentaires du site <![CDATA[ Attribut SVG viewbox, bon pour le responsive ]]>

Merci beaucoup pour ce commentaire ! (je vais investiguer) ]]> text/html https://www.nicolas-hoffmann.net/source/1634-Attribut-SVG-viewbox-rwd-responsive.html#comment158599 Nico Sun, 07 Sep 2014 22:32:11 +0200 <![CDATA[ Attribut SVG viewbox, bon pour le responsive ]]>

Pour faire beaucoup de svg en effet la balise viewBox est très important pour le responsive, malheureusement ce n'est pas suffisant. En effet, internet explorer (y compris IE11) ne modifiera pas la hauteur qui restera à 150px.
La seule solution actuelle pour avoir un svg vraiment responsive c'est d'utiliser le "padding hack". En gros on met un bloc container autour du svg et on ne lui attribue pas de hauteur et on utilise un padding-bottom pour garder les proportions. Le svg est ensuite placer en absolut par rapport au bloc. Il doit y avoir pas mal d'exemples sur google.

Bonne journée! ]]> text/html https://www.nicolas-hoffmann.net/source/1634-Attribut-SVG-viewbox-rwd-responsive.html#comment158598 David Sun, 07 Sep 2014 12:04:51 +0200