How to edit WordPress CSS written as inline CSS? [duplicate]


Tags: html,css,wordpress,inline

Problem :

This question already has an answer here:

I'm trying to edit the CSS of a WordPress template.

I am using Firefox to find the CSS styles and found the line I need to edit, which looks like this:

<div style="transition: height 350ms ease 0s; height: 450px;" class="og-expander">

What I want to do is to change height: 450px to height: 100%.

I have tried editing the og-expander class' height, but it didn't work. I realized that the height property within og-expander are disabled because of the inline CSS, but I can't find the place to edit the inline CSS.

I have searched through some other CSS files as well, but I failed to find it.



Solution :

You can override the style added directly to the element with !important after the style statement in your css files. For instance

.og-expander {
    height: 350px !important;
    transition: 0 !important;
}

Also, you might try searching all your php files to edit that place directly. If its added in core or plugins, direct editing would be a bad idea, so try to find an appropriate filter or action hook.


    CSS Howto..

    How to inspect value both in Mozilla Firebug?

    How to create centered ordered list with HTML/CSS?

    How To Center Align Menu Through CSS?

    How can I count HTML elements on a printed page using CSS?

    How to make a background with 45 degree lines with css?

    How can I fix this CSS positioning for the transition to work? (CSS3 with Bootstrap)

    How to use a lower resolution image for mobile?

    How to transform xPath to CSS Selector

    How to make a pie chart in CSS

    How do i make li active in angularJS?

    how to allow transform in htmlpurifier

    How to toggle two buttons on mouse hover?

    jQuery UI how to avoid submit button getting css classes?

    How to create this type of element using XHTML & CSS?

    How to restrict character limit by line or # of characters with css?

    How to add top-right arrow in bootstrap navbar dropdown menu

    How to render CSS and HTML elements back to the Client's Browser from Form-POST acction and JavaScript?

    How to position an image list marker so that the text is vertically centered

    How to add strped tabs on Ionic css

    How to align images in a mosaic style? html/css

    How to add a mobile optimised external CSS to a Shopify site

    How to keep nav bar from shifting elements to next line when zooming in?

    How to apply more than 1 CSS styles in javaScript? [duplicate]

    How to use inline CSS by th:style using “The ? : operator” in ThymeLeaf

    How to change CSS when user scrolls past a certain div

    How to edit and see live CSS effect in IE8 like we see in Firefox > Web developer toolbar > Edit CSS function?

    How to escape quotes in Less variable which stores a color name?

    How would I re-position my 2nd bg image “ url(repeat_bg_right_side.png) ” to the right side of page using css?

    simplecart.js Images not Showing in IE8 on blogger.com site

    How do you make a sticky nav bar change colour when you scroll to a desired div?