Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 7 of 7
  1. #1
    Junior Member
    Join Date
    Oct 2005
    Posts
    24
    Member #
    11727
    I have a set of images, 7 total, 27 px high and totaling 800 pixels wide in a div id'd "nav". The problem is on the page there is ~10px space inbetween the images and the final image gets shoved down to a second line. At a width of ~820 px, the final image is on the same line as the rest, but there is still the space. Here are the two snippets of code in question:

    -----HTML-----
    <div id="nav">
    <img src="inc/index_02.jpg" width="171" height="27" border="0">

    <a href="index.php"><img src="inc/site_04_01.jpg" border="0" width="63" height="27" ></a>

    <a href="index.php?sc=graphics"><img src="inc/site_04_02.jpg" border="0" width="98" height="27" ></a>

    <a href="index.php?sc=tutorials"><img src="inc/site_04_03.jpg" border="0" width="98" height="27" ></a>

    <a href="index.php?sc=dls"><img src="inc/site_04_04.jpg" border="0" width="119" height="27" ></a>

    <a href="index.php?sc=contact"><img src="inc/site_04_05.jpg" width="80" height="27" border="0" ></a>

    <img src="inc/index_08.jpg" width="171" height="27" border="0">
    </div>

    -----CSS-----

    #nav {
    width: 800px;
    height: 27px;
    }

    Can any of you guys find an error? I'm having no luck on such a venture.

  2.  

  3. #2
    Senior Member hyperair's Avatar
    Join Date
    May 2005
    Posts
    452
    Member #
    9892
    add this to css:

    Code:
    #nav a,#nav img {
    margin: 0px;
    }
    Hyperair

  4. #3
    Junior Member
    Join Date
    Oct 2005
    Posts
    24
    Member #
    11727
    No dice. Still got the probem.

  5. #4
    Member
    Join Date
    Dec 2005
    Posts
    92
    Member #
    12042
    #nav a,#nav img {
    margin: 0px;
    padding: 0px;
    }

    That?

  6. #5
    Junior Member
    Join Date
    Oct 2005
    Posts
    24
    Member #
    11727
    Sadly, no.

    I guess its somewhere else. I just uploaded the full html and CSS, here they are.

    HTML
    CSS

  7. #6
    Senior Member igeek's Avatar
    Join Date
    Oct 2005
    Posts
    202
    Member #
    11644
    you should put the navigation links in UL and LI tags and position them horizontal

  8. #7
    Senior Member hyperair's Avatar
    Join Date
    May 2005
    Posts
    452
    Member #
    9892
    the problem lies in the html code. each of your link has a space in between them. that's causing the problem. remove them, or.. surround each link with a div.. like:
    Code:
    <div id="nav">
    <div style="display: inline"><img src="inc/index_02.jpg" width="171" height="27" border="0"></div>
    <div style="display: inline"><a href="index.php"><img src="inc/site_04_01.jpg" border="0" width="63" height="27" ></a></div>
    
    <div style="display: inline"><a href="index.php?sc=graphics"><img src="inc/site_04_02.jpg" border="0" width="98" height="27" ></a></div>
    
    <div style="display: inline"><a href="index.php?sc=tutorials"><img src="inc/site_04_03.jpg" border="0" width="98" height="27" ></a></div>
    
    <div style="display: inline"><a href="index.php?sc=dls"><img src="inc/site_04_04.jpg" border="0" width="119" height="27" ></a></div>
    
    <div style="display: inline"><a href="index.php?sc=contact"><img src="inc/site_04_05.jpg" width="80" height="27" border="0" ></a></div>
    
    <div style="display: inline"><img src="inc/index_08.jpg" width="171" height="27" border="0"></div>
    </div>
    that should remove the spacing.. by the way.. for the left and right side image.. (index_02.jpg and index_08.jpg) i suggest u put it as a background

    Code:
    #nav
    {
    width: 800px;
    height: 27px;
    background-image: url('inc/index_02.jpg');
    background-repeat: repeat-x;
    }
    Hyperair


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 05:50 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com