Not signed in (Sign In)

SkillShare - A place to discuss Web Standards and Web Design topics

Categories

Vanilla 1.1.5a is a product of Lussumo. More Information: Documentation, Community Support.

  1.  permalink
    Hi,

    I'm having two problems with the page I'm creating.

    The first is spacing between some images in firefox in the top 2 boxes.

    The second is the background behind the block of text (at the bottom of the page) seems to have disappeared since I floated divs on top of it. Why would that happen?

    http://3skimo.com/medical/indexhome.html

    Thank you.
    • CommentAuthoralias
    • CommentTimeJun 4th 2007
     permalink
    hi,

    I think floating the images should solve your first problem.

    the second problem (disappearing background) occurs due to the fact that both it's child elements are floated, thus NOT having a physical layout. therefore their parent element automatically sets it's height and width to the first non-floated element. to solve this - just add something like <div style="clear: both;"></div> after the two floated elements, it will help ;)

    regards,
    M.Saulis
  2.  permalink
    Thank you. The fix for the second problem worked but unfortunately not the first. If I float the images it all collapses. So I'm still getting the spacing below each image. I can't see anything in the code that would cause this spacing everytime.
    • CommentAuthoralias
    • CommentTimeJun 5th 2007
     permalink
    the spacing appears becasue the images are just layed out in the html like <img /> <img /> <img />, thus the line break produces the spacing. so you whether minimize the line-height (this works, test it and choose the line height that suits you and doesn't break the tables over there):
    #enterENT {
    line-height: 12px;
    }


    or use this one, works pretty well, but you'll probably need to clear the floats here aswel just like in the previous issue.
    #enterENT img,
    #enterOphthalmic img {
    float: left;
    cler: both;
    }
    #enterENT table,
    #enterOphthalmic table {
    float: left;
    }


    regards,
    Martin Saulis
  3.  permalink
    Works perfectly with the altered line-height - thank you! :)
  4.  permalink
    To know more about freelancing

    experiences and new freelance works contact

    http://tinyurl.com/yr4k7n

    http://www.getafreelancer.com/affiliates/L

    antis/
Add your comments
    Username Password
  • Format comments as (Help)