Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Dimensions of site elements change on click

  • This topic is empty.
Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #235280
    digifocus
    Participant

    Hi,

    I have build a repsonsive site using the bootstrap framework. I noticed that the complete site and elements respond to click events in a way that is not desired. I have tested this in Chrome and IE and both respond the same. So I think there is something in the CSS causing this.

    When you click on a block or a paragraph of text the site is moving.

    The URL of the site is: http://www.maaikesatelier.nl/overmaaike
    I hope one of you guys can help me out.

    Thx,
    Marcel

    #235281
    Shikkediel
    Participant

    It has to do with this border that is added :

    .img-thumbnail:link, :visited, :active {
    border: 1px solid #DDD;
    }
    

    On line 277 of home.css.

    #235282
    digifocus
    Participant

    Thanks for your feedback but this isn’t the solution. When I click on every element it moves.

    #235283
    Paulie_D
    Member

    I think Shikkediel was on the right track.

    This:

    .ximg-thumbnail:link, :visited, :active {
        border: 1px solid #ddd;
    }
    

    looks to be the culprit.

    I suspect it’s incorrect and should be:

    .ximg-thumbnail:link, 
    .ximg-thumbnail:visited, 
    .ximg-thumbnail:active {
        border: 1px solid #ddd;
    }
    

    At the moment any element is getting this border when it is clicked.

    #235290
    Shikkediel
    Participant

    Ah, that detail I missed. The added borders seem to be messing with collapsing margins or something (since all elements have box-sizing applied)…

    #235572
    digifocus
    Participant

    Hi guys,

    Thanks for your input. I just changed the css and it worked!

    Thanks.

    Marcel

Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.