Grow your CSS skills. Land your dream job.

small problem with space

  • # February 8, 2009 at 1:46 am

    hi,

    ive a simeple html gallery, almost is done, excep 1 small problem.
    its a white space bellow the image (that you can see in demo or in file attack)

    demo; http://huyha.net/files/gallery.html
    white space problem: http://huyha.net/files/remove-white-space.png

    I want to remove white space bellow the image, ive using fireBug to see where the problem come from but i dont see anything.

    thanks

    # February 8, 2009 at 3:47 am

    if you click the image, the dotted line that shows you the focus, shows that the image has a spare bit of white space, but looking at the image on a dark background and making that image a link, shows that it does not…..

    this can only suggest that your blue highlight code has a fault with the sizes.

    but looking at your code you had this:
    .theme_field:hover {
    border: 5px solid #0073BA;
    }

    I changed it to this, to add a background, and it sorted it
    .theme_field:hover {
    border: 5px solid #0073BA;
    background-color:#0073BA;
    }

    although clicking the image link still show a bit of extra space at the bottom, however, it is blue, but still if you are a perfectionist, then you might want to look for the link sizes to fix it

    ik

    p.s. check your spelling, detailds is wrong,

    # February 8, 2009 at 6:55 am

    thanks for your help,

    ive added background color as you sugess to my code now,
    im not a perfectionist, but im want to know exactly the problem, so next time i can understand it quickly ;)

    ya my english is not good, i still learning english from the internet now.

    # February 8, 2009 at 7:36 am
    "jingjang" wrote:
    thanks for your help,

    ive added background color as you sugess to my code now,
    im not a perfectionist, but im want to know exactly the problem, so next time i can understand it quickly ;)

    ya my english is not good, i still learning english from the internet now.

    you could also make your margin-top -5px

    Code:
    .theme_field img {}
    .theme_link {
    color:#fff;
    margin-top:-5px;
    }
    # February 8, 2009 at 11:52 pm

    thanks you very much
    here is my last version; http://huyha.net/files/gallery2.html

    # February 9, 2009 at 4:57 am
    "jingjang" wrote:
    thanks you very much
    here is my last version; http://huyha.net/files/gallery2.html

    glad you got it sorted

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".