28112 sujets

CSS et mise en forme, CSS3

upload/1509970571-58614-screenshot-2017-11-6sitetempo.png Bonjour,
Je bute depuis des heures sur la suppression de la colonne gauche. J'ai déjà supprimé un certain nombre d'éléments mais je n'arrive pas à suppriemr complètement l'espace (voir image)
La page est http://tmp.88h.ovh/
Merci pour vos conseils et aide
body:not(.logged-in) #mCSB_1 {
  display: none; 
  padding:0px;   
}
body:not(.logged-in) #navigation {
  display: none; 
  padding:0px;   
}


@+
Modifié par HDcms (06 Nov 2017 - 13:16)
Modérateur
Salut,


Tu as un padding-left de 100px sur le header, le content et le footer. C'est ça qui crée ce décalage.
Salut
Merci pour le coup d’œil rapide.
Du coup j'ai fais
#main-header, #main-content, #main-footer {padding-left:0px;}

mais ça fait longtemps que je n'ai pas fais de CSS. ou est l'erreur ?
@+
Bonjour,

par exemple pour le header (que vous appelez #main-header), la règle que vous venez de citer est 'surpassée' par :
body.rtl.force-responsive #main-header:not(.navigation-hidden){padding-right: 200px;}

une règle qui est plus spécifique.

D'après les outils de développement présents dans mon navigateur, cette règle se trouve avec… un bon paquet d'autres à la ligne 223 de votre fichier HTML.

Smiley smile
Modifié par Zelena (06 Nov 2017 - 14:15)
Modérateur
HDcms a écrit :
Salut
Merci pour le coup d’œil rapide.
Du coup j'ai fais
#main-header, #main-content, #main-footer {padding-left:0px;}

mais ça fait longtemps que je n'ai pas fais de CSS. ou est l'erreur ?
@+


C'est parfait comme ça. Comme le dit Zelena c'est juste une histoire de priorité ( -> https://developer.mozilla.org/fr/Apprendre/CSS/Introduction_%C3%A0_CSS/La_cascade_et_l_h%C3%A9ritage ).

Il faut donc augmenter le poids du sélecteur pour surpasser le reste. On peut tricker un peu en faisant un truc pas spécialement joli mais bon, au point ou on en est Smiley langue
#page-wrapper #main-header,
#page-wrapper #main-content,
#page-wrapper #main-footer {
    padding-left: 0;
}


[EDIT] Ou via !important comme tu as fait oui... j'aime pas trop l'utiliser mais là ca peut se justifier oui Smiley lol
#laFlemmeDuLundi
Modifié par _laurent (06 Nov 2017 - 14:26)
Re
ah bien sûr une histoire de priorité
du coup j'ai fais
#main-header, #main-content, #main-footer {padding-left:0px!important;}

et ça la l'air de fonctionner Smiley smile
re
dernière ptit question, comme je traite de manière différente si un membre est connecté ou non,
je veux rétablir le padding-left pour les connectés.
Hors j'ai essayé plusieurs formes mais aucune convient.
body:not(.logged-in) #main-header, body:not(.logged-in) #main-content, body:not(.logged-in) #main-footer {padding-left:0px!important;}

quelle est la bonne que je n'ai pas essayée Smiley rolleyes ?
Meilleure solution
Très mauvais idée d'utiliser !important en effet. Mieux vaut supprimer la propriété ou utiliser un sélecteur supérieur ou équivalent.
re
ah je sais que ce !important n'est pas la meilleure solution mais si vous pouviez me donner le code correspondant avec ma dernière demande !
@+
Modérateur
HDcms a écrit :

body:not(.logged-in) #main-header, body:not(.logged-in) #main-content, body:not(.logged-in) #main-footer {padding-left:0px!important;}


Ça devrait marcher. Qu'est-ce qui bloque ? Tu ne vois pas la colonne quand tu es connecté ?
Es-tu sur que la classe "logged-in" est bien placée sur le body ?
Quand je rajoute à la main la classe "logged-in" sur le body ca marche bien
Modifié par _laurent (06 Nov 2017 - 15:18)
HDcms a écrit :
re
ah je sais que ce !important n'est pas la meilleure solution mais si vous pouviez me donner le code correspondant avec ma dernière demande !
@+


Utiliser !important trahit que vous ne comprenez rien à la cascade. Donc effectivement quand on ne comprend pas ce que l'on fait ça ne fonctionne pas comme ça devrait. C'est surtout cela votre problème Smiley murf
RE
@_laurent
Effectivement cela fonctionne maintenant Smiley smile . Peut-être un problème de cache pour tant j'avai bien vider le cache du navigateur!!

@bzh
effectivement je ne comprends rien à la cascade et moyennement css3 Smiley decu . C'est pour cela que je viens ici d'ailleurs.
J’imagine que vous apprécierez dans un autre domaine (ou vous n''êtes pas très performant) avoir une réponse du type (solution + liens plus théorique pour approfondir)

@+
En l’occurrence vous n'avez rien appris et reviendrez demain avec les mêmes questions. Mais si certains ont du temps pour, alors pourquoi pas.
@bzh
Bonjour !!
Je vous trouve très condescendant. Votre "contribution" étant dans le jugement. Je suggérai que vous répondiez de manière plus constructive. C'est pas votre truc, vous n'avez pas compris et reviendrai gémir ici. Le jour ou vous trouverez dans une situation similaire, peut-être comprendrez-vous mieux !?

@autres
Merci de m'avoir suggéré des pistes

@+
Modifié par HDcms (07 Nov 2017 - 10:15)
Je n'ai aucun soucis à être condescendant avec ceux qui se contentent des pire solutions. D'autre part vous n'avez même pas agit de manière construite vous-même en répondant je sais mais donnez-moi mon code.
@bzh
Effectivement en réponse à des propos que soupçonné hautains, je me suis permis de demander un code et des liens pour aller plus loin. Et effectivement la condescendance se confirme, vous préféré déplorer que de me renvoyer sur un tutoriel. C'est votre droit. Allez on retourne chacun dans notre code.
Vous comprendrez (peut-être) le jour ou vous serez dans la même situation que moi dans un autre domaine
_laurent t'as fourni un lien vers la cascade
Zelena t'as copié collé le secteur exact
Je t'ai répété qu'il ne faillait surtout pas utiliser !important

Ici c'est une communauté d'apprentissage sur les standards. Si tu ne t’intéresses ni à l'un ni à l’autre que fais-tu ici ? Et bien tu viens profiter des compétences d'autres (pour au final ne rien lire/écouter de ce qu'on te raconte en plus) et ici comme dans d'autre communautés tu ne seras pas bien vu pour cela.
@bzh
ben t'as tout compris, je viens uniquement sur ce site pour ce que tu as dis ! La majorité de ce fil tourne autour de ton 1er message que j'ai trouvé hautain et condescendant ... en un mot inutile.
Les autres je les ai remercié Smiley merci , je n'ai eu un différent qu'avec toi Smiley nananere
Effectivement j'avai zappé une info dans leurs messages ,merci de me l'avoir fait relire.
Comme quoi je suis en plus imparfait Smiley jap
Bonne journée
PS: je ne répondrai plus car je pense que celà ne sert à rien et n'est pas dans l'esprit du forum
Modifié par HDcms (08 Nov 2017 - 10:02)