button alignment stopped working

  • I have a lot of “Buy Print” buttons on my photography web site. At some point, last year I think, the alignment of those buttons was lost. I can still choose left/center/right in the block editor, and that works in the editor, but in the actual page it’s always aligned left.

    In the example page I posted, the alignment is set to ‘right’ but the button appears at left.

    I find lots of references to this problem going back a couple of years, but no definitive solution. Is button alignment just broken?

    • This topic was modified 1 year, 8 months ago by jimh12345.

    The page I need help with: [log in to see the link]

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

  • I find lots of references to this problem going back a couple of years, but no definitive solution. Is button alignment just broken?

    1) Common symptom, but a million different causes. So there’s not one “definite solution” — what worked for someone may not work for you (because of different root causes).

    2) The design/presentation/appearance of your site is, by and large, the job of your active theme. WordPress may indeed introduce a feature that may cause something in your theme (or plugin) to break, but it’s still the theme’s job to address the problem.

    3) To get your alignment working, go to APPEARANCE => CUSTOMIZE => ADDITIONAL CSS, add the following, and hit PUBLISH:

    .is-layout-flex {
    display: flex;
}

    (If you have something else in there, put this at the very end.)

    Standing by for feedback.

    Thread Starter jimh12345

    (@jimh12345)

    Well that actually seems to work in my case, and it doesn’t appear to have broken anything else. So I rank this in the top 2% of WP fixes.

    Of course I’d rather have found the root cause, and not just thrown more CSS into the hopper (what’s “flex” anyway?), but that’s probably beyond my understanding at present.

    Thanks George!

    Moderator bcworkz

    (@bcworkz)

    “Flex” is a CSS layout model. If your theme has element class attribute “is-layout-flex” and does not declare it display: flex;, it’s apparently some kind of oversight, because declaring flex alone doesn’t accomplish much without other supporting declarations, which are apparently already in place. So that’s the root cause you and George just fixed, a theme oversight.

    Thread Starter jimh12345

    (@jimh12345)

    Yes, “display:flex” seemed scarily generic. The theme is old, and the buttons used to align properly, but who knows. As a former software developer I really dislike the layered aspect of WP – everything’s declarative, not procedural, fingers pointed in all directions, no obvious way to debug a problem. I suppose if I had serious knowledge of CSS I’d at least know where to look.

    Thanks for the insights.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘button alignment stopped working’ is closed to new replies.