Spacing Between Images

Discussion in 'HTML and CSS' started by LazyCarrot, Apr 10, 2016.

  1. LazyCarrot

    LazyCarrot

    Joined:
    Apr 10, 2016
    Messages:
    4
    Likes Received:
    0
    Bit basic guys but I seem to be getting 'filler' in-between my graphics that i can't account for.

    I have a <div> width of 960px and 2 images of 750px and 210px respectively.
    but they won't sit next to each other unless i reduce one of the graphics by 6 pixels
    and this then leaves a 6px 'spacer' between the 2 graphics.

    I have been ultra explicit in removing margin, border, and padding in both the CSS and HTML

    This is the coding.....

    CSS:

    #frame-container { width: 960px; padding: 0; margin: 0; border: 0; }

    HTML:

    <div id="frame-container">
    <img src="images/header-test.png" margin="0" padding="0" border="0" width="750px" />
    <img src="images/bucket-test.png" margin="0" padding="0" border="0" width="210px" />
    </div>


    Ok - I've donned my thick skin for when you point out what basic error i've overlooked...
     
    LazyCarrot, Apr 10, 2016
    #1
    1. Advertisements

  2. LazyCarrot

    LazyCarrot

    Joined:
    Apr 10, 2016
    Messages:
    4
    Likes Received:
    0
    Ok - have just stumbled across my own answer.... duh!!!
    it's because the 2 <img> statements have space between them in the coding - which is being interpreted as a physical space.

    So the simple answer is to butt the 2 statements next to each other..
    Which is effective but looks untidy in the coding... is there a better way of coding this so it's more readable?
     
    LazyCarrot, Apr 10, 2016
    #2
    1. Advertisements

  3. LazyCarrot

    LazyCarrot

    Joined:
    Apr 10, 2016
    Messages:
    4
    Likes Received:
    0
    ... And in answer to myself - in case anyone else is reading this.... yeah, it's just <div>'s and float.... all very basic stuff.
    Get a grip man! The white space stuff threw me and nothing seemed to be making sense. Just needed a night's sleep on it.
     
    LazyCarrot, Apr 11, 2016
    #3
    1. Advertisements

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments (here). After that, you can post your question and our members will help you out.