wet-boew / wet-boew-styleguide

A style guide for the Web Experience Toolkit.
http://wet-boew.github.io/wet-boew-styleguide/index-en.html
36 stars 32 forks source link

Removing the space between an h level and the next paragraph #248

Open suzanneIRB opened 9 years ago

suzanneIRB commented 9 years ago

We are looking for a class which would remove the space between an H level and a paragraph or div. (or two paragraphs or a table and a paragraph, etc.) rather than using a br tag.

On our website we use the class .tight {margin-top:-6px;}

Here's an example of a page where the legend that follows the image would contain the class tight. http://www.irb-cisr.gc.ca/Eng/BoaCom/empl/Pages/MemComMspPsc.aspx

The class tight is attached to a p tag preceded by an H2 and removes the space between the H2 and the P.

thomasgohard commented 9 years ago

You can use the mrgn-{tp|bttm}-0 classes for this.

suzanneIRB commented 9 years ago

Thank you. I have copied this class to our stylesheet as we are still using WET 3. I tried it and it made no change, the space was still there. I will try it again.

In the meantime, would there a separate javascript that makes it work that wouldn’t necessarily be part of the WET 3 template, hence the reason why it is not working?

Bonne journée / Have a nice day Suzanne Burbidge

Agente de soutien du Web Commission de l'immigration et du statut de réfugié du Canada / Gouvernement du Canada suzanne.burbidge@cisr-irb.gc.camailto:suzanne.burbidge@cisr-irb.gc.ca Tél. lundi, mercredi & vendredi: 613-769-9006 • mardi & jeudi : 613-834-9957 Télécopieur : 613-996-0270 Twitter : @CISR_Canada

Web Support Officer Immigration and Refugee Board of Canada / Government of Canada suzanne.burbidge@irb-cisr.gc.camailto:suzanne.burbidge@irb-cisr.gc.ca Tel. Monday, Wednesday & Friday: 613-769-9006 • Tuesday & Thursday: 613-834-9957 Fax: 613-996-0270 Twitter: @IRB_Canada [cid:image001.jpg@01D0A1F4.684292F0]

From: Thomas Gohard [mailto:notifications@github.com] Sent: June 8, 2015 1:38 PM To: wet-boew/wet-boew-styleguide Cc: Burbidge, Suzanne Subject: Re: [wet-boew-styleguide] Removing the space between an h level and the next paragraph (#248)

You can use the mrgn-{tp|bttm}-0 classes for this.

— Reply to this email directly or view it on GitHubhttps://github.com/wet-boew/wet-boew-styleguide/issues/248#issuecomment-110087121.

* This E-mail is sent from the Immigration and Refugee Board of Canada. As this message may contain confidential information, if you are not the intended recipient, please delete the E-mail and notify the sender. / Ce courriel a été envoyé par la Commission de l'immigration et du statut de réfugié du Canada. Il pourrait contenir des renseignements confidentiels; s'il vous est parvenu par erreur, veuillez le supprimer et aviser l'expéditeur immédiatement. *

thomasgohard commented 9 years ago

In WET 3, the equivalent classes are called margin-{top|bottom}-none.

suzanneIRB commented 9 years ago

Yes, however, we are changing all of our wet3 and in-house classes in our existing documents to reflect the ones in WET4. We are copying to our stylesheets, their equivalent from WET4.

. mrgn-tp-0 {margin-top:0;}, does not work nor does margin-top-0 in WET3 for that matter, which is why we had to create our own class to remove the space.

In order for this to work, the value needs to be negative, as in our in-house class.

.tight {margin-top:-6px;} So is there a class in WET4 to address this scenario?

Bonne journée / Have a nice day Suzanne Burbidge

Agente de soutien du Web Commission de l'immigration et du statut de réfugié du Canada / Gouvernement du Canada suzanne.burbidge@cisr-irb.gc.camailto:suzanne.burbidge@cisr-irb.gc.ca Tél. lundi, mercredi & vendredi: 613-769-9006 • mardi & jeudi : 613-834-9957 Télécopieur : 613-996-0270 Twitter : @CISR_Canada

Web Support Officer Immigration and Refugee Board of Canada / Government of Canada suzanne.burbidge@irb-cisr.gc.camailto:suzanne.burbidge@irb-cisr.gc.ca Tel. Monday, Wednesday & Friday: 613-769-9006 • Tuesday & Thursday: 613-834-9957 Fax: 613-996-0270 Twitter: @IRB_Canada [cid:image001.jpg@01D0A28E.0A33D850]

From: Thomas Gohard [mailto:notifications@github.com] Sent: June 8, 2015 5:03 PM To: wet-boew/wet-boew-styleguide Cc: Burbidge, Suzanne Subject: Re: [wet-boew-styleguide] Removing the space between an h level and the next paragraph (#248)

In WET 3, the equivalent classes are called margin-{top|bottom}-none.

— Reply to this email directly or view it on GitHubhttps://github.com/wet-boew/wet-boew-styleguide/issues/248#issuecomment-110139776.

* This E-mail is sent from the Immigration and Refugee Board of Canada. As this message may contain confidential information, if you are not the intended recipient, please delete the E-mail and notify the sender. / Ce courriel a été envoyé par la Commission de l'immigration et du statut de réfugié du Canada. Il pourrait contenir des renseignements confidentiels; s'il vous est parvenu par erreur, veuillez le supprimer et aviser l'expéditeur immédiatement. *

thomasgohard commented 9 years ago

In the example you provided, there's a margin-bottom on the h2 and a margin-top on the p. To simulate your class tight, you would apply margin-bottom-none/mrgn-bttm-0 on the h2 and margin-top-none/mrgn-tp-0 on the p.