CSS class for single column not working

  • Resolved Bianca

    (@bianca205)


    6 years, 11 months ago

    Hey guys,
    Amazing work on the plugin as always especially the new advanced columns block. Just been implementing it and came across this issue:

    When you add a class to a single column (so not the parent that holds both columns) it’s not acting as expected. For example I have three columns which I want to have a white background and a shadow each. I added a class for the shadow. But it’s not appearing when I apply it. The white bg is fine. No sign in the class in the html either so it’s not being outputted properly I guess. Thanks for looking into this.

Viewing 5 replies - 1 through 5 (of 5 total)
  • Jack

    (@moxie)

    6 years, 11 months ago

    I have the same thing. I added a two column block and added a css class to each column. This class is not saved.

    It works okay with the default WP columns, but not with the Atomic Blocks columns,

    Plugin Author John Parris

    (@mindctrl)

    6 years, 11 months ago

    Thanks for the report! We’ll get this fixed up as soon as possible.

    Plugin Author John Parris

    (@mindctrl)

    6 years, 11 months ago

    @bianca205 the update today fixes this issue. Let us know if you run into anything else!

    Thread Starter Bianca

    (@bianca205)

    6 years, 11 months ago

    Hi John, Thanks for your super quick follow up.
    I can confirm that the class gets added and so resolving the issue.

    However the class gets added to the ab-block-layout-column while all the other column settings (which you can visually set in the column block settings) get added to the ab-block-layout-column-inner. Although in my specific using case the css can be set to make it fit with the shadow, I’m not sure if adding the class to ab-block-layout-column is ideal in general (as the visual styling get added in ab-block-layout-column-inner).

    Plugin Author atomicblocks

    (@atomicblocks)

    6 years, 10 months ago

    Hi Bianca,

    Thanks for the feedback. Unfortunately, the Additional CSS Class output is traditionally tied to the parent block (in this case the individual column) and the other settings, we can apply as needed to whatever div makes the most sense. We could potentially output that class on the ab-block-layout-column-inner div, but then we wouldn’t have a custom class output on the parent div. By adding it to the parent div, all use cases can be covered and inner divs can be targeted with CSS. Hope this helps!

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

The topic ‘CSS class for single column not working’ is closed to new replies.