WordPress.org

Forums

WP Tiles
[resolved] Outline is bigger with Firefox 12.02 (14 posts)

  1. SickNick
    Member
    Posted 2 years ago #

    Hi,
    I really love this plugin.My only problem is that,after the last update of Firefox (12.02),the outline of a post on hover,is bigger and it messes with the other posts.
    With Chrome and explorer everything works just great.

    http://wordpress.org/extend/plugins/wp-tiles/

  2. Mike Martel
    Member
    Plugin Author

    Posted 2 years ago #

    Hi Nick, thanks for your comment. Can you elaborate a bit? Do you mean the outline when you hover? Can you maybe send a screenshot and/or a link to your website?

    Thanks!

  3. SickNick
    Member
    Posted 2 years ago #

    Yes,when you hover with the latest firefox.
    Here is the website e-bodyguide.gr

  4. claudia.komesu
    Member
    Posted 2 years ago #

    Hi Mike, congrats for the great plugin, it's very nice.

    I was doing some tests, and it seems the same thin borders appear in Chrome 25.0.1364.172 m, the last update. In Firefox and in IE 8 it's all right, just Chrome has these borders, sometimes on the top, sometimes on the left.

    I made a temporary post: http://virtude-ag.com/teste-do-wp-tiles/

    When you have a time, could you please check if is something easy to resolve?

    Many thanks and kind regards,
    Claudia

  5. Mike Martel
    Member
    Plugin Author

    Posted 2 years ago #

    Hi guys, I see the problem. In FF the outline is placed around the shadow (instead of just around the border). There's a couple of solutions, but I'm a bit hesitant adding the to the plugin straight away, as they may break other people's sites.

    1. Disable the box-shadow (this seems to be Claudia's solution)
    2. Turn the outline into a box-shadow itself - like this
    box-shadow: 0 0 1px 1px #ccc
    3. Disable the outline and use another or nu effect for user feedback

    I'm thinking about including a couple of options in the plugin in a later stage. Until that time, I think these are your options.

  6. SickNick
    Member
    Posted 2 years ago #

    Second solution worked for me,thank you

  7. kurtau22
    Member
    Posted 1 year ago #

    Where exactly should "box-shadow: 0 0 1px 1px #ccc" go?

  8. Mike Martel
    Member
    Plugin Author

    Posted 1 year ago #

    In your custom stylesheet, in a rule for the tiles themselves. For example:

    div.wp-tile-container .grid > div:hover {
        outline: none;
        box-shadow: 0 0 1px 1px #ccc;
    }
  9. kurtau22
    Member
    Posted 1 year ago #

    That worked, but now I've noticed that drop shadow doesn't show in chrome at all (it didn't show before this change either), so I'd like to remove the drop shadow all together.

    What CSS will do that?

  10. Mike Martel
    Member
    Plugin Author

    Posted 1 year ago #

    Set box-shadow to none, like this:

    div.wp-tile-container .grid > div:hover {
        outline: none;
        box-shadow: none;
    }
  11. kurtau22
    Member
    Posted 1 year ago #

    Hmm... I'm still seeing it in firefox. When I hover over it, the drop shadow goes away, but I'd like for it to be gone all the time.

    I tried this, but it didn't change anything.

    div.wp-tile-container {
    outline: none;
    box-shadow: none;
    }

  12. Mike Martel
    Member
    Plugin Author

    Posted 1 year ago #

    You want it to hide both the outline and the box-shadow on hover and in normal state. Change it to this:

    div.wp-tile-container .grid > div, div.wp-tile-container .grid > div:hover {
        outline: none;
        box-shadow: none;
    }
  13. kurtau22
    Member
    Posted 1 year ago #

    Still seeing it. Top right of sidebar here.

  14. kurtau22
    Member
    Posted 1 year ago #

    Doh, ignore me. Got it. Thanks!

Topic Closed

This topic has been closed to new replies.

About this Plugin

  • WP Tiles
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic