• Hi! I’m Andrea, i’ve got a problem with widgets and css. (Sorry for my bad english, i’m italian and i’ll try to explain as better as possible)

    I can’t find, in the source code, where the widget CSS is collocated. If I insert a widget, the html code in the page looks like this:

    <div id=”sidebar1″ class=”sidebar”>

    <li id=”text-3″ class=”widget widget_text”><h2 class=”widgettitle”>Test </h2> <div class=”textwidget”>ciao!</div>
    </div>

    in the css, i found “sidebar” and “sidebar1”, but i can’t find “widget”, “widget_text”, “widgettitle” and “textwidget”, even in the WP source files… Can you help me? I need to edit it!

    You can find the WP example in http://www.spaceradionet.it/wp

    Thank you!!

Viewing 4 replies - 1 through 4 (of 4 total)
  • if it is not in style.css – add it.

    as you already found out, most widgets have their own css class – or more than one class – but these classes are generally not in style.css of the themes.
    the widgets would simply inherit the styles of the theme, and the sidebar.

    if you need to specially style some widgets, add the classes to the style.css.

    in your case you could add

    .widget_text {.....}
    .textwidget {.....}

    Thread Starter qualio

    (@qualio)

    i tried to, but adding .widget_text etc etc, it does not override the original css.

    And, looking at the html, i can’t understand where the hell is defined the widget CSS.

    Any ideas?

    This is indeed difficult! Using Google web developer tools, you can right click on a page, and use the ‘outline’ and then ‘current element’ and hover the mouse over the item in question, and at the top of the browser there will be a strip with the css style info for that item! Neat huh?

    From there, all you need do is find / add in your style.css document the styles you want these items to have!

    Now, getting multiple widgets on different pages to all respect their style commands? Priceless.

    I’m still working on that part my self XD

    Qualio, it should be defined in functions.php of your theme.

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

The topic ‘wigets and css’ is closed to new replies.