Support » Plugin: Custom Related Posts » CSS in settings

CSS in settings

  • Resolved lhotc

    (@lhotc)


    10 months, 1 week ago

    Hi Guys,
    hope you are well.

    I have a problem with the CSS on the settings page.
    I entered the following:
    .crp-list-item{
    display: inline-flex;
    }
    I have a CRP Block on one page to test this. But the css that I inserted above is overidden by the css from the plug-in.
    i.e. in Firefox Dev Tools I see the following:
    .crp-list-item.crp-list-item-has-image {

    display: flex;
    margin: 5px 0;

    }
    .crp-list-item {

    display: inline-flex;

    }

    where the 2nd item is crossed out as firefox takes the display:flex; from the first item.

    Can you please help on how to insert custom css that won’t be overriden by the plug-ins css.

    Thanks a lot

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Author Brecht

    (@brechtvds)

    10 months, 1 week ago

    Our CSS takes precedence there because it’s more specific. It targets “.crp-list-item.crp-list-item-has-image” and not just “.crp-list-item”.

    So either use that same specificity (or even more specific by adding a parent):

    .crp-list-item.crp-list-item-has-image {
display: inline-flex;
}

    Or use an !important flag to force your styling:

    .crp-list-item {
display: inline-flex !important;
}
    Thread Starter lhotc

    (@lhotc)

    10 months, 1 week ago

    Ah, thanks a lot. Works.

    Cheers
    Jan

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘CSS in settings’ is closed to new replies.

Views