Créer une "boîte" pour mon site

wp-infinity
ThemeForestElegantThemes

Merci de vous inscrire pour participer au forum
Invité

Rechercher

— Forum Scope —




— Correspondances —





— Options du forum —





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

S'inscrire Mot de passe oublié ?
forum-theme
Créer une "boîte" pour mon site
Coquilledelune
Membre
Membres
Messages du forum : 4
Membre depuis :
3 octobre 2016
sp_UserOfflineSmall Hors ligne
1
3 octobre 2016 - 09:37
sp_Permalink sp_Print

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
sp_UserOfflineSmall Hors ligne
2
3 octobre 2016 - 10:32
sp_Permalink sp_Print

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

100son
Corrèze
Modérateur
Membres

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

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
sp_UserOfflineSmall Hors ligne
4
3 octobre 2016 - 16:05
sp_Permalink sp_Print

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
sp_UserOfflineSmall Hors ligne
5
5 octobre 2016 - 20:17
sp_Permalink sp_Print

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)

100son
Corrèze
Modérateur
Membres

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

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 :
6 Invité(s)

Actuellement sur cette page :
1 Invité(s)

Auteurs les plus actifs :

BrunoT: 52

vKr_Onii: 42

bosschris: 39

athox: 26

Martine677: 25

monchihuahua: 25

Dan: 24

regisbor33: 23

monblogestunroman: 23

Nouveaux membres :

josehartsock1

Talisker25

maziecrocker

barbpaulk0349

Djiman

sherrillv03

latashaflagg556

jefferybustamant

niklasm62431705

Statistiques du forum :

Groupes :3

Forums :9

Topics :702

Posts :2782

 

Statistiques des membres :

Invités: 23

Membres : 8655

Modérateurs : 27

Admins: 1

Administrateurs :Thibaud

Modérateurs :Sylvain, bruno, david, Catherine0614, zapps, soborne, Mojiezuo, Soufian Ait Tirite, Jeff, redwhirl, sigridregnier, Jess, Malles, spleen13, Alain2choeur, kaepaul, negativenetwork, Pictures4events, 100son, Ben 44, Ailpp84, joecab, SPITI, Fatalys, Therese, P-x3l, Gayraud Marina