Problème de mise en page : image de fond qui prend toute la place

[anne]

bonjour,

j'espère poster dans la bonne section, veuillez m'excuser si ce n'est pas le cas...

Je viens de tenter de refaire mon site avec la nouvelle mise en page. Après avoir bien galéré (je suis nulle dans ce domaine), j'ai enfin un bidule à peu près propre, sauf que :
- l'image prend toute la place et il faut jouer de l'ascenseur pour voir qu'il y a du texte en dessous, et je ne parviens pas à modifier les dimensions de la bête
- l'image (le papier peint fleuri) est également présent sur la droite de l'écran, sauf que ça ne sert à rien et qu'il y a donc un "ascenseur horizontal" en bas de page qui ne sert à rien

Comment puis-je régler tout ça ?
merci de votre aide !!

[anne]

pardon, je m'aperçois qu'il n'y a ici que les bugs, or je pense que mon problème vient de mon incompréhension, pas d'un bug...
désolée désolée désolée... :/

[FredVig]

Bonjour, certains designs proposent pour la page d’accueil une image qui se dimensionne selon la taille de la fenêtre navigateur, dans les limites du contenant où se trouve l'image.
Cela permet une certaine souplesse au design, mais peut ne pas convenir, comme vous le constatez.
Dans les solutions à explorer :
- changer de design (bof
- Insérer une image petite
- insérer une image à l'intérieur d'un autre contenant, qui lui ne change pas de dimension, comme une galerie d'image
- ajouter du code dans le head mais il faut comprendre un peu le HTML, comme cela est expliqué dans les tutos de ce forum. Par exemple en imposant une largeur maximum à votre image.

J'ajoute que le comportement de la barre oblique de ce design provoque effectivement un bug, forçant l'ascenseur horizontal à apparaître.
Le soucis semble venir de cette class :
.slope {
border-width: medium 1680px 84px medium;
Sans doute Jimdo devrait revoir ce détail, car l'effet n'est pas terrible…
en attendant, cela peut être supprimé simplement ainsi :
copier le code ci-dessous >

Code:

<style type="text/css">
/*<![CDATA[*/
.slope {border-width: medium 0px 0px medium !important;}
 /*]]>*/
</style>

modifier le head > coller > enregistrer
Si vous voyez que cela provoque d'autres bugs, supprimez simplement le code.

[anne]

merci !

par contre, je ne comprends pas bien : je la colle où, cette formule magique ?
"modifier le head" ça n'existe plus, apparemment, avec les nouveaux design, ou alors je n'ai pas trouvé où ça se cachait ?

D'autre part, depuis hier je ne parviens plus à modifier les styles, ni police ni taille, c'est assez bizarre...

[Gwenael.Jimdo]

Bonjour Anne,

Pour modifier le Head, rendez-vous dans ''paramètres'' > "modifier le head" > http://screencast.com/t/44ZNNPfb

Ensuite copier/coller le code et "enregistrer".

Concernant le problème de modification du style, de la couleur et de la taille, faites-vous référence à votre titre ou aux textes du site dans leur ensemble ?

Une bonne journée à tous.

[anne]

génial, ça marche ! Mille mercis FredVig et Gwenaël !

Pour la modification du style, je ne parle que du titre.

[Gwenael.Jimdo]

Parfait !

Pour votre problème de titre, il s'agit d'un bug survenu hier sur plusieurs de nos nouveaux designs, nos techniciens se penchent actuellement sur celui-ci et il devrait être résolu rapidement.

[anne]

Ok merci !

De toute façon, pour le moment, je crois que je vais laisser comme ça, sauf si quelqu'un sait comment diminuer la hauteur de la frise fleurie, qui prend toute la place. Sinon, aucune importance, au moins, le site est à peu près fonctionnel...

Merci de votre aide, de votre efficacité et de votre rapidité !

[Gwenael.Jimdo]

le problème d'édition du titre a été corrigé  

Pouvez-vous vous rendre sur votre site et me confirmer que vous pouvez maintenant faire des modifications du titre ?

A bientôt.

[anne]

yes I can.

merci !

[FredVig]

comment diminuer la hauteur de la frise fleurie

Modifier le head > ajouter après les modifs précédentes et avant les signes de fermeture de css

Code:

.logo-wrapper {  min-height: (ici, un chiffre de votre choix, inférieur à 230)px!important;}

[anne]

je viens d'essayer, mais ça ne change pas.
Ai-je fait une erreur ?
Voici ce qui est affiché :

<style type="text/css">
/*<![CDATA[*/
.slope {border-width: medium 0px 0px medium !important;}
/*]]>*/
.logo-wrapper {min-height: 100px !important;}
</style>

[FredVig]

C'est presque ça, mais vous avez mal placé le groupe de signes qui ferme la commande
En html, il faut penser "poupées gigognes"
Chaque fois (ou presque) qu'on ouvre une instruction, il faut la refermer après avoir inséré à l'intérieur les "victimes" de cette instruction.
<style type="text/css">, c'est la mâchoire du haut, </style>, la mâchoire du bas
idem avec /*<![CDATA[*/ et /*]]>*/
idem avec chaque accolade

<style type="text/css">
/*<![CDATA[*/
.slope {border-width: medium 0px 0px medium !important;}
.logo-wrapper {min-height: 100px !important;}
/*]]>*/
</style>

[anne]

merci Fred !
...
mais ça ne change rien.

J'ai tenté de diminuer le chiffre jusqu'à 50px, et rien ne bouge.

Ce n'est pas grave, laissez tomber, je vais me dépatouiller autrement. Je vais faire une page d'accueil vide, avec juste le titre et la bande déco, et je ferai des onglets supplémentaires.

Merci vraiment de votre coup de main, c'est fort appréciable et fort apprécié !

[FredVig]

Laisser tomber ne fait pas trop partie de mes habitudes… Le code fonctionne, on peux le tester en ligne avec l'inspecteur de style de firefox, mais peut-être que je n'ai pas compris ce que vous vouliez réaliser ? Si vous voulez réduire davantage, c'est possible. Il faut identifier l'élément qui prend la place, et rajouter, par exemple, une modification sur cette valeur : .logo-wrapper { padding: 90px 20px; et le minheight à 100px
ça donnerait ça :
<style type="text/css">
/*<![CDATA[*/
.slope {border-width: medium 0px 0px medium !important;}
.logo-wrapper {min-height: 100px !important; min-height: 0px !important; padding: 0px 20px!important;}
/*]]>*/

</style>

[anne]

ahhh super !!!! là ça marche nickel !!
je pense que c'est moi qui n'étais pas claire dans mes questions. Merci !!

Du coup, j'abuse une dernière fois de votre gentillesse : la zone blanche, entre ma frise fleurie et le début du texte, n'y aurait-il pas moyen de la réduire aussi ?

[FredVig]

ça, c'est plus délicat.
Cette zone est nécessaire à cause du plan incliné au dessus.
Si vous avez une page très large, cela peut causer des soucis d'affichage. le coin gauche inférieur du plan incliné est au raz du haut de votre texte.
Et c'est délicat de faire "passer par dessus" le texte principal.
Cet espace est constitué d'une série de valeur en "poupées gigognes" qu'il faut toutes modifier, mais pas trop.
Il y a :
.slope-wrapper { height: 150px;
que vous pourriez remonter à 100px
mais pour le reste, la marge de manœuvre est limité

[anne]

J'ai tout bien suivi, j'ai fait ça :
<style type="text/css">
/*<![CDATA[*/
.slope {border-width: medium 0px 0px medium !important;}
.slope-wrapper { height: 80px; !important;}
.logo-wrapper {min-height: 100px !important; min-height: 60px !important; padding: 60px 20px!important;}
/*]]>*/

</style>


Et c'est cette fois absolument parfait ! (enfin, il me semble ?)

Je ne vous ennuie plus, merci encore !
belle journée à vous !!

[FredVig]

Bien joué !

[Contenu sponsorisé]