Aller au contenu
Invision Board France
  • 0

Changer la taille du logo


Bocar

Question

12 réponses à cette question

Messages recommandés

  • 0
  • Administration

Bonsoir,

c’est parce que ce n’est pas avec la hauteur du logo qu’il faut jouer, mais avec la hauteur du header.

 

Essaie de modifier les propriétés CSS suivantes :

--header--height: 80px;
--responsive-header--height: 55px;

En live sur ton site, quand je désactive la propriété --header--height, le logo devient énorme.

 

Mais attention à ne pas définir une hauteur trop grande, car les éléments situés à la droite du logo sont centrés en hauteur et cela pourrait ne plus être très ergonomique.

 

PS : les outils de dev de Firefox sont tes amis pour tester des modifications CSS/HTML en live.

Lien vers le commentaire
Partager sur d’autres sites

  • 0
  • Administration

Bonjour,

 

en tout cas ce n’est pas dans le code HTML :

<a href='{setting="base_url"}' id='elLogo' accesskey='1'><img src="{$logo}" alt='{setting="board_name" escape="true"}'></a>

Et tout ce que je trouve dans les CSS ou dans le PCA a un lien avec la hauteur, mais pas la largeur.

Tu passes bien par éditer le thème, puis onglet logo pour utiliser ton image personnalisée ?

Lien vers le commentaire
Partager sur d’autres sites

  • 0
Il y a 5 heures, Youp3 a dit :

Tu passes bien par éditer le thème, puis onglet logo pour utiliser ton image personnalisée ?

Oui.

 

 

On ne peut pas ajouter un width et un height à ce code :

<a href='{setting="base_url"}' id='elLogo' accesskey='1'><img src="{$logo}" alt='{setting="board_name" escape="true"}'></a>

?

 

 

Merci.

Lien vers le commentaire
Partager sur d’autres sites

  • 0
#elLogo{
	flex: 0 1 auto;
	min-width: 0;
	display: inline-flex;
	align-items: center;
	align-self: stretch;
	height: var(--header--height);
}

ou

	#elLogo img {
		max-width: 100%;
		max-height: var(--logo--height);
	}

dans core > global > framework > global.css ?

 

 

Ou alors

		#elLogo img {
			max-height: var(--responsive-logo--height);
		}

dans core > global > responsive > global.css ?

 

 

 

Merci @Youp3.

Modifié par Bocar
Lien vers le commentaire
Partager sur d’autres sites

  • 0
  • Administration

Tout dépend de la configuration de ton thème (largeur flexible ou non).

Le mieux c’est que tu testes, car de mon côté je n’ai pas regardé plus précisément.

  • J’aime 1
Lien vers le commentaire
Partager sur d’autres sites

  • 0
il y a 19 minutes, Youp3 a dit :

Tout dépend de la configuration de ton thème (largeur flexible ou non).

Le mieux c’est que tu testes, car de mon côté je n’ai pas regardé plus précisément.

OK, mais où dois-je mettre le width et le height pour le logo ?

Lien vers le commentaire
Partager sur d’autres sites

  • 0

Hello,

 

normalement toute surcharge de css doit se mettre dans le fichier custom.css

Ce fichier est chargé en dernier justement dans le but d'être prioritaire :)

 

C'est comme cela jusqu'en version 4.4 en tout cas.

 

image.png.ffa585ea54cfe04817fd9326c5cf1d0b.png

 

 

 

Ce que ne comprends pas, c'est que le logo doit prendre la taille de celui que tu uploads, ce n'est pas le cas ?

 

Lien vers le commentaire
Partager sur d’autres sites

  • 0

Je n'ai pas quoi tester là, je ne garanti rien mais dans un premier temps, tu peux effectivement le mettre sur  #elLogo img  { .... }

Si ça ne suffit pas, essayer dans #elLogo { .... }

 

Mais comme dit par Youp3, je mieux est de tester par toi même :)

+ Attention à la conf du thème, flexible, responsive...

 

Edit: Je viens de voir qu'il y a des valeurs max-width et max-height qui pourraient t'ennuyer.

En théorie ça devrait donner quelque chose dans le genre:

/* xxx et yyy à remplacer par tes valeurs */

#elLogo img {
    width: xxx;
    height: yyy;
    max-height: unset;
    max-width: unset;
}

 

Modifié par cybero
Lien vers le commentaire
Partager sur d’autres sites

Rejoindre la conversation

Vous pouvez publier maintenant et vous inscrire plus tard. Si vous avez un compte, connectez-vous maintenant pour publier avec votre compte.

Invité
Répondre à cette question…

×   Collé en tant que texte enrichi.   Coller en tant que texte brut à la place

  Seulement 75 émoticônes maximum sont autorisées.

×   Votre lien a été automatiquement intégré.   Afficher plutôt comme un lien

×   Votre contenu précédent a été rétabli.   Vider l’éditeur

×   Vous ne pouvez pas directement coller des images. Envoyez-les depuis votre ordinateur ou insérez-les depuis une URL.

Chargement
×
×
  • Créer...

Information importante

En utilisant ce site, vous êtes d’accords avec nos Conditions d’utilisation. Nous avons placé des cookies sur votre appareil pour aider à améliorer ce site. Vous pouvez choisir d’ajuster vos paramètres de cookies, sinon nous supposerons que vous êtes d’accord pour continuer.