treehouse : what would you like to learn today?
Web Design Web Development iOS Development

small problem with space

  • 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
  • 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,
  • 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.
  • "jingjang" said:
    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


    .theme_field img {}
    .theme_link {
    color:#fff;
    margin-top:-5px;
    }
  • thanks you very much
    here is my last version; http://huyha.net/files/gallery2.html
  • "jingjang" said:
    thanks you very much
    here is my last version; http://huyha.net/files/gallery2.html


    glad you got it sorted