Créer une "boîte" pour mon site | Forum WordPress


Rechercher

— Forum Scope —




— Correspondances —





— Options du forum —





La longueur minimum du terme à rechercher est 3caractère - la longueur maximum est de 84 caractères

Mot de passe oublié ?
forum-theme
Créer une "boîte" pour mon site
Ajouter une réponse
Coquilledelune
Membre
Membres
Messages du forum : 4
Membre depuis :
3 octobre 2016
Hors ligne
1
3 octobre 2016 - 09:37

Le plus compliqué dans mon problème va être de le comprendre... De comprendre ce que je cherche à faire... 
Je voudrais que mon site s'arrête en bas de l'écran et qu'en bas de l'écran il y ait le footer mais sans avoir à scroller pour arriver en bas... en fait, je voudrais que mon site qui est pour le moment comme ça : 

http://www.jacobieski.fr/portfolio/peinture/

ressemble à ça (dans la structure) avec une barre de défilement sur la droite : 

https://creativemarket.com/creative.slides/785628-Artistic-Muse-Template/screenshots/#screenshot1

Coquilledelune
Membre
Membres
Messages du forum : 4
Membre depuis :
3 octobre 2016
Hors ligne
2
3 octobre 2016 - 10:32

Bon j'ai réussi mais y'a une barre de scroll dans mon menu du haut maintenant... 

Avatar
Samson
Corrèze
Modérateur
Membres

Modérateurs
Messages du forum : 117
Membre depuis :
27 novembre 2014
Hors ligne
3
3 octobre 2016 - 13:49

Salut,

Pour que ton footer soit fixe, sans barre de scroll, il faut le faire coller au bas de page.

/* STICKY FOOTER */
footer.footer.grey-bg {
position: fixed;
z-index: 99; /*que le contenu passe en dessous*/
width: 100%;
bottom: 0; /*collé en pied de page */
padding: 15px; /* un peu moins épais */
height: 60px;
}

Ensuite j'ai remarqué que le contenu passait devant le menu, donc comme le footer, on lui donne un index très haut pour ne plus voir ça :

/* CONTENU DERRIERE LE MENU */
div.navbar.navbar-inverse.bs-docs-nav.navbar-fixed-top.sticky-navigation.appear-on-scroll {
z-index: 99;
}

 

Pour que ce soit plus joli, je pense qu'il faudrait que ton fond d'écran prenne toute la hauteur, à moins que tu cherches à emboîter le contenu dans cette taille d'image (pas forcément évident)

Je donne mon avis aussi : je trouve dommage d'avoir cette barre latérale. Je pense que toutes les pages méritent d'être en pleine largeur

A+

cratylik.com Fusion, Rock Instrumental | flaviensabot.com Artiste peintre | solid-art.fr Collectif de sculpteurs à la tronçonneuse

Coquilledelune
Membre
Membres
Messages du forum : 4
Membre depuis :
3 octobre 2016
Hors ligne
4
3 octobre 2016 - 16:05

Merci pour ta réponse 100son 🙂 

J'ai fini par y arriver, voilà le résultat que je voulais, sauf qu'il y a un espace entre le main et le footer sur certains écrans malgré le fait que j'ai mis une valeur en rem... 

http://www.jacobieski.fr/portfolio/peinture/ 

Pour ce faire, j'ai créé une nouvelle feuille css avec ce code : 

#content div.container {overflow : auto}

div#primary {height : 37rem}

Coquilledelune
Membre
Membres
Messages du forum : 4
Membre depuis :
3 octobre 2016
Hors ligne
5
5 octobre 2016 - 20:17

Bon... après m'être pris la tête pendant...trop de temps, pour arriver à ce que mon body arrive pile là où commençait mon footer (chose qui fonctionnait sous un browser mais pas l'autre), j'ai fini par tester ta solution et voilà :

http://www.jacobieski.fr/portfolio/peinture/

Je n'ai pas mis ce qui concernait la hauteur du footer car je l'avais déjà corrigé ni la couleur grise du background puisque je l'avais aussi corrigé mais voilà 🙂

Merci beaucoup 100son !!

Et au passage, j'ai changé pas mal de choses au niveau ergonomie. Qu'en penses-tu ? (reste à changer la couleur des ancres qui sont orange pas très lisible)

Avatar
Samson
Corrèze
Modérateur
Membres

Modérateurs
Messages du forum : 117
Membre depuis :
27 novembre 2014
Hors ligne
6
5 octobre 2016 - 21:10

Salut,

Oui, je trouve ça beaucoup plus clair comme ça !

Bonne idée les ancres. L'idéal serait de créer des boutons simples en faisant une classe css (que tu peux réutiliser sur des liens ou dans le menu pour 'Contact' ou autre...)

Tu as juste à appeler ta classe bouton sur le lien <a href="#lien" class="bouton1">Texte du lien</a><br>

.bouton1 p a {
line-height: 2em;
background-color: #ffffff;
padding-left: 8px;
padding-right: 8px;
font-weight: bold;
text-transform: uppercase;
border-style: solid;
border-width: 2px;
border-radius: 8px
}

 

Après, ça manque juste un peu de séparation entre les différentes sections. Une simple ligne peut suffire, et ajouter un peu d'espace aussi.

 

Content de pouvoir t'aider ! Wink

cratylik.com Fusion, Rock Instrumental | flaviensabot.com Artiste peintre | solid-art.fr Collectif de sculpteurs à la tronçonneuse

Fuseau horaire du forum :Europe/Paris

Nb max. d'utilisateurs en ligne :574

Actuellement en ligne :
8 Invité(s)

Actuellement sur cette page :
1 Invité(s)

Auteurs les plus actifs :

Bruno: 52

Robin: 44

vKr_Onii: 41

bosschris: 39

Dan: 27

Nouveaux membres :

Lucinda

Carole_1

Sylvie_1

Julien_1

Jean-françois_1

Statistiques du forum :

Groupes :1

Forums :7

Topics :572

Posts :2383

 

Statistiques des membres :

Invités: 31

Membres : 9936

Modérateurs : 26

Admins: 2

Administrateurs :wpengine, Thibaud

Modérateurs :Gebhard, david, Catherine1, zapps, soborne, mojiezuo, Soufian, Jeff, redwhirl, sigridregnier, Jessica, Benjamin2, spleen13, Alain2, kaepaul, negativenetwork, Gaetan1, Samson, Benoit1, Ailpp84, Joel2, Catherine2, Fatalys, Therese, Guillaume3, Gayraud

En ligne

16 visiteurs, 13 membres

Messages récents