Firebug says edit element.style, can't seem to find it!

  • Resolved greg.a.pfeffer

    (@gregapfeffer)


    11 years, 3 months ago

    Hello,
    On http://www.greek-life-apps.com…. I’m using the FreshServe theme…

    I’m trying to move the “Take a Video Tour” button over to the right and upwards some, so it looks good with the rest of the page above the fold. I’d modified everything else using FireBug and modifying style.css, but I can’t seem to find how to move that element…instead of having it in style.css, it says element.style which makes me thing its CSS is written in-line in the HTML…but where do I find the HTML in the FreshServe theme to edit? I’ve looked in index.php and header.php, cant seem to find!

    Thanks in advance!

    Greg P.

Viewing 7 replies - 1 through 7 (of 7 total)
  • WPyogi

    (@wpyogi)

    11 years, 3 months ago

    The relevant CSS for that button is:

    a.button {
    use margins here;
}

    It’s getting overridden by “yellow-red.css”. But do be aware that any changes you make to theme files will be overwritten and lost when your theme is updated. It’s recommended to use a child theme or custom CSS to avoid that.

    paulwpxp

    (@paulwp)

    11 years, 3 months ago

    Maybe a little more specific like 

    .info .button.icon {

}

    since this is only for that one location.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    11 years, 3 months ago

    You can use a browser developer tool to expose the styles for you.
    You don’t need to then look for where those styles originate. All necessary information has been exposed by the developer tool, for which you can then override them in a Child Theme stylesheet or Custom CSS plugin.

    Thread Starter greg.a.pfeffer

    (@gregapfeffer)

    11 years, 3 months ago

    Hi All,
    I created a child theme (freshserve-child) and created a custom style.css, with this included

    @import url("../freshserve/style.css");

a.button {
    margin:250px;

}

    Still doesn’t seem to be working. margin:250px seems to work in firebug for moving the item over to the right, but I can’t seem to move it up for some reason…

    WPyogi

    (@wpyogi)

    11 years, 3 months ago

    You need to use 4 margin measures: top, right, bottom, left:
    or use specific margin-right: XXpx;

    For all i.e.:

    a.button {
    margin: 10px 5px 10px 250px;

}

    Obviously those are just random numbers – adjust accordingly. And BTW, you CAN use negative margins to move “backwards.”

    Thread Starter greg.a.pfeffer

    (@gregapfeffer)

    11 years, 3 months ago

    WPyogi-

    I managed to add margin-left:

    a.button {
    color: #FFFFFF;
    font-size: 12px;
    font-weight: bold;
    margin-left: 200px;
    padding: 8px 15px 10px 0;
    position: relative;
    text-decoration: none;
}

    But negative margins don’t seem to have any effect on the up/down…

    Any idea whats going on?

    Thread Starter greg.a.pfeffer

    (@gregapfeffer)

    11 years, 2 months ago

    Sorry to just clarify, I added

    ` margin-left: 200px;

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Firebug says edit element.style, can't seem to find it!’ is closed to new replies.