Title: align wide margin issue
Last modified: July 16, 2020

---

# align wide margin issue

 *  Resolved [Keirwatson](https://wordpress.org/support/users/keirwatson/)
 * (@keirwatson)
 * [5 years, 10 months ago](https://wordpress.org/support/topic/align-wide-margin-issue/)
 * Bug report?
 * I have inserted a GB container block with wide-width, and I can see that this
   generates css with the appropriate negative margin-left. All right and good.
 * If, however, I then give the block a top margin of, say, -4em, the block creates
   css of margin: -4em 0 0 (even though I have left the other margin fields blank),
   which overrides the alignwide margin-left, misplacing the container horizontally.
   It would be better if it only applied margin-top: -4em.

Viewing 10 replies - 1 through 10 (of 10 total)

 *  Plugin Author [Tom](https://wordpress.org/support/users/edge22/)
 * (@edge22)
 * [5 years, 10 months ago](https://wordpress.org/support/topic/align-wide-margin-issue/#post-13133597)
 * Hi there,
 * Ah, this happens because GenerateBlocks writes the shorthand CSS for you when
   it comes to margin/padding.
 * I’ll look into our options here.. it would be a shame to lose that shorthand 
   CSS because of something like align-wide.
 * One solution is to wrap your container in another container, and align-wide the
   outer container. Kind of page-builder-y, but it should work.
 * I’ll see if we can implement something better 🙂
 * Thanks!
 *  Thread Starter [Keirwatson](https://wordpress.org/support/users/keirwatson/)
 * (@keirwatson)
 * [5 years, 10 months ago](https://wordpress.org/support/topic/align-wide-margin-issue/#post-13134461)
 * As a matter of interest, I found that the headline block does not have this problem.
 * I know it does not have a Wide Width button, but I just add “alignwide” in the
   css class advanced field.
 * In this case the shorthand css for my top margin (-4em 0 0) is output before 
   the alignwide, so the alignwide left margin overwrites it and behaves as expected.
 * I don’t know if you can make this behaviour happen for other blocks?
 * ——-
 * Suggestion: Blank vs 0 values?
 * The intuitive behaviour (from a user perspective) is that only margin-top should
   be set if I only fill in the top margin value. I would only expect the compact
   output if I chose 0 in the other fields. As it is, these fields can be left blank,(
   or deleted to make them blank). The fact I can choose 0 or blank gives the impression
   that these options produce different results.
 * If your preference is that casual users get the compact version then present 
   the fields with a default value of 0, but allow these to be deleted (blank) forcing
   margin-top etc.
 *  Plugin Author [Tom](https://wordpress.org/support/users/edge22/)
 * (@edge22)
 * [5 years, 10 months ago](https://wordpress.org/support/topic/align-wide-margin-issue/#post-13137771)
 * Interesting – any chance you can link me to an example with the Container and
   Headline block?
 * I agree. We actually do this on tablet/mobile (so they inherit desktop values),
   but decided against it on desktop. I’ll look at this to see if it’s something
   we can do without negatively affecting existing sites 🙂
 *  Thread Starter [Keirwatson](https://wordpress.org/support/users/keirwatson/)
 * (@keirwatson)
 * [5 years, 10 months ago](https://wordpress.org/support/topic/align-wide-margin-issue/#post-13138699)
 * I have set up a brief demo at the end of an old post: [https://herbidacious.calamus.graphics/2010/04/04/20/](https://herbidacious.calamus.graphics/2010/04/04/20/)
 * Hope that helps.
 * (Note: I’ll delete the demo it in a couple of days)
 *  Plugin Author [Tom](https://wordpress.org/support/users/edge22/)
 * (@edge22)
 * [5 years, 10 months ago](https://wordpress.org/support/topic/align-wide-margin-issue/#post-13139933)
 * In this case it seems to be working?: [https://www.screencast.com/t/1zQ01LjrvIp](https://www.screencast.com/t/1zQ01LjrvIp)
 *  Thread Starter [Keirwatson](https://wordpress.org/support/users/keirwatson/)
 * (@keirwatson)
 * [5 years, 10 months ago](https://wordpress.org/support/topic/align-wide-margin-issue/#post-13140205)
 * OK, I see, it seems to be browser specific.
 * The problem shows on my default browser (Safari) but is correct on Chrome.
 * Here is a screenshot from my Safari browser:
 * > [View post on imgur.com](https://imgur.com/PcnYmnR)
 *  Plugin Author [Tom](https://wordpress.org/support/users/edge22/)
 * (@edge22)
 * [5 years, 10 months ago](https://wordpress.org/support/topic/align-wide-margin-issue/#post-13143001)
 * Strange, not seeing it on Safari, either. What version are you using?
 *  Thread Starter [Keirwatson](https://wordpress.org/support/users/keirwatson/)
 * (@keirwatson)
 * [5 years, 10 months ago](https://wordpress.org/support/topic/align-wide-margin-issue/#post-13147260)
 * After a bit of trial and error, I have worked out that the problem (as shown 
   in the screenshot I linked) only arises when a post is previewed.
 * It does this when previewed in Chrome too, so it isn’t browser specific.
 * For some reason in post preview the css for .gb-container gets a higher priority
   than .entry-content .alignwide leading to the container margins overwriting the
   margin-left – as shown in my screenshot above, whereas once published these reverse
   so the problem does not appear.
 * The same problem arises if the grid block is used, but not if the Headlines block
   is used.
 *  Plugin Author [Tom](https://wordpress.org/support/users/edge22/)
 * (@edge22)
 * [5 years, 10 months ago](https://wordpress.org/support/topic/align-wide-margin-issue/#post-13147582)
 * Ah, that makes sense. When previewing, inline CSS is used over the external file.
   Perhaps we just need to push the inline CSS down further in the document to prevent
   this from happening. I’ll play with it.
 * Thanks for letting me know! 🙂
 *  Thread Starter [Keirwatson](https://wordpress.org/support/users/keirwatson/)
 * (@keirwatson)
 * [5 years, 10 months ago](https://wordpress.org/support/topic/align-wide-margin-issue/#post-13185012)
 * Pleased to help.
 * Love your work.

Viewing 10 replies - 1 through 10 (of 10 total)

The topic ‘align wide margin issue’ is closed to new replies.

 * ![](https://ps.w.org/generateblocks/assets/icon.svg?rev=3239461)
 * [GenerateBlocks](https://wordpress.org/plugins/generateblocks/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/generateblocks/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/generateblocks/)
 * [Active Topics](https://wordpress.org/support/plugin/generateblocks/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/generateblocks/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/generateblocks/reviews/)

 * 10 replies
 * 2 participants
 * Last reply from: [Keirwatson](https://wordpress.org/support/users/keirwatson/)
 * Last activity: [5 years, 10 months ago](https://wordpress.org/support/topic/align-wide-margin-issue/#post-13185012)
 * Status: resolved