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 4 of 4
  1. #1
    Junior Member
    Join Date
    Mar 2011
    Posts
    9
    Member #
    27069
    This happened to the last site I was coding too, and I was never able to fix it.

    For some reason I am ending up with a bunch of extra space on the right side of my website. Firefox will allow the user to keep scrolling right even though there is no information there.

    The container has a set width, and is centered using margin-left and right auto.

    It works find in Safari.
    Any advice?

    Here is the URL
    http://www.digitalintrospect.net/labels/index2.html


    and here is the code:
    <!DOCTYPE html>
    <head>
    <meta content="en-us" http-equiv="Content Language"/>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />


    <style type="text/css">

    #body
    {font-family:Verdana, Arial, Helvetica, sans-serif;
    }
    #container
    {width:1000px;
    margin-left:auto;
    margin-right:auto;
    }
    #header
    {
    height:150px;
    margin-left:auto;
    margin-right:auto;
    }

    #header img.logo
    {display:inline;
    height:100px;
    }

    #header table
    {position:relative;
    top:-70px;
    left:725px;
    width:325px;
    }
    #header .icons
    {width:300px;
    margin-left:40%;}

    #header .icons img
    {
    width:30px;}

    #mainnav
    {position:relative;
    top:-70px;}

    #subnav
    {
    width:450px;
    position:relative;
    top:490px;
    left:30px;
    }
    #subnav p
    {text-indent:10px;}

    table#infonav
    {width:250px;
    height:100px;
    position:relative;
    top:290px;
    left:525px;}

    table#infonav td
    {height:40px;
    }

    .community
    {width:50px;
    margin-left:3%;
    }

    #main .main
    {width:900px;
    height:509px;
    position:absolute;
    }
    #main .nav
    {width:70px;}
    #main .nav2
    {width:60px;
    }

    #textbody
    {position:relative;
    top:300px;
    width:875px;
    }
    #textbody p
    {text-indent:10px;}

    </style>
    <script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css">

    <title>Labels luxury Consignment</title>
    <script type="text/javascript">
    <!--
    function MM_swapImgRestore() { //v3.0
    var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a)&&x.oSrc;i++) x.src=x.oSrc;
    }
    function MM_preloadImages() { //v3.0
    var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a.indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a;}}
    }

    function MM_findObj(n, d) { //v4.01
    var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
    if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[n];
    for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers.document);
    if(!x && d.getElementById) x=d.getElementById(n); return x;
    }

    function MM_swapImage() { //v3.0
    var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
    if ((x=MM_findObj(a))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
    }
    //-->
    </script>
    </head>
    <body onLoad="MM_preloadImages('images/direct_purchase_button_mouseoever.png')">


    <div id="container">
    <header>
    <div id="header">

    <img src="images/labels_logo.png" alt="Labels" class="logo">

    <table style="width:200px;">
    <tr>
    <td><div class="icons">
    <img src="images/email.png" alt="email" class="email">
    <img src="images/shopping_cart.png" alt="shopping cart" class="cart">
    </div><!-- end #icons --></td>
    </tr>
    <tr>
    <td> <div id="search">

    <form method="get" action="http://www.google.com/search">
    <input type="text" name="q" size="15" maxlength="225" value="" placeholder="search"/>
    <input type="submit" value="GO"/>
    <input type="hidden" name="sitesearch" value="www.labelsluxury.com"/>
    </form>
    </div></td>
    </tr>
    </table>


    <div id="mainnav">
    <ul id="MenuBar1" class="MenuBarHorizontal">
    <li><a class="MenuBarItemSubmenu" href="sellandconsign.php">Sell Your Bag</a>
    <ul>
    <li><a href="directpurchase.php">Direct Purchase</a></li>
    <li><a href="sellandconsign.php">Consignment</a></li>
    </ul>
    </li>
    <li><a class="MenuBarItemSubmenu" href="#">Shop</a>
    <ul>
    <li><a href="shop/handbags/handbags.php">Handbags</a></li>
    <li><a href="shop/shoes/shoes.php">Shoes</a></li>
    <li><a href="shop/jewelry/jewelry.php">Jewelry</a></li>
    <li><a href="shop/sunglasses/sunglasses.php">Sunglasses</a></li>
    </ul>
    </li>
    <li><a class="MenuBarItemSubmenu" href="designers.php">Designers</a>
    <ul>
    <li><a class="MenuBarItemSubmenu" href="#">Item 3.1</a>
    <ul>
    <li><a href="#">Item 3.1.1</a></li>
    <li><a href="#">Item 3.1.2</a></li>
    </ul>
    </li>
    <li><a href="#">Item 3.2</a></li>
    <li><a href="#">Item 3.3</a></li>
    </ul>
    </li>
    <li><a href="authenticity.php">Authenticity</a></li>
    <li><a href="locations.php">Locations</a></li>
    <li><a href="contact.php">Contact</a></li>
    <li><a href="aboutus.php">About Us</a></li>
    </ul>
    </div><!-- end #mainnav -->




    </div><!-- end #header-->
    </header>

    <section id="main">


    <img src="images/red_and_black_handbags.jpg" alt="labels luxury consignment" class="main">
    <br />


    <table id="subnav">
    <tr>
    <td><img src="images/handbags.png" alt="handbags" class="nav">
    <img src="images/shoes.png" alt="Shoes" class="nav">
    <img src="images/accessories.png" alt="accessories" class="nav">
    <a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Direct Purchase','','images/direct_purchase_button_mouseoever.png',1)"><img src="images/direct_purchase_button.png" alt="Direct Purchase" name="Direct Purchase" class="nav2" style="margin-left:25px;"></a><img src="images/consign_money_button.png" alt="Consign" class="nav2"></td>
    </tr>
    <tr>
    <td><p>Shop with <strong>Labels</strong> for a coveted new or nearly new handbag and other great accessory spanning many decades by designers such as Hermes, Chanel, Louis Vuitton, Gucci, Prada, Bottega Veneta, J P Tods, Christain Dior, YSL, Fendi, Burberry, Balenciaga and Marc Jacobs.</p></td>
    </tr>
    </table>

    <table id="infonav">
    <tr>
    <td colspan="2"><div style="margin-left:30%;">1-800-555-1234</div></td>

    <td></td>
    </tr>
    <tr>
    <td height="38"><ul><li>Return Policy</li>
    <li>Shipping Info</li>
    </ul></td>
    <td><ul>
    <li>Press</li>
    <li>Site Map</li>
    </ul></td>
    </tr>
    <tr>
    <td colspan="2"><img src="images/facebook.png" alt="facebook" class="community"><img src="images/ebay.png" alt="ebay" class="community"><img src="images/twitter.png" alt="twitter" class="community"><img src="images/email.png" alt="mailing list" class="community"></td>
    </tr>
    </table>

    <div id="textbody">
    <p>In porta, sem in ullamcorper luctus, sapien urna fermentum nibh, ac posuere sapien nisl aliquam purus. Integer sed lorem sagittis nibh dapibus convallis. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla convallis hendrerit tortor, ut volutpat enim varius sit amet. Etiam facilisis, ante at hendrerit fermentum, dui neque consequat magna, quis convallis urna ligula id felis. In dignissim molestie nisi. </p>
    </div><!-- end #textbody -->

    </section><!---#main -->


    </div><!-- end #container -->
    <script type="text/javascript">
    <!--
    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
    //-->
    </script>
    </body>
    </html>

  2.  

  3. #2
    Member surfbouy's Avatar
    Join Date
    Dec 2010
    Location
    Noosa, Sunshine Coast, Queensland, Australia
    Posts
    46
    Member #
    25747
    Liked
    3 times
    [S][/S]Hey digitalintrospect,
    I think the trouble lies in one of your tables.
    If you make the left: 0px the extra space goes away, then you could add a float etc. to fix it's position
    table#infonav {
    height: 100px;
    left: 0px;
    position: relative;
    top: 290px;
    width: 300px;
    display: inline;
    float: right;
    padding-right: 400px;
    }
    Your other option would be to make it a nested table...
    and we all know we shouldn't use tables for layout but it will be the simplest as you have already done this for the site..
    Cheers
    hope it helps

  4. #3
    Member desktop's Avatar
    Join Date
    Mar 2011
    Location
    Michigan
    Posts
    42
    Member #
    27184
    Liked
    4 times
    Just a word of advice: People don't like to scroll right.

  5. #4
    Junior Member
    Join Date
    Mar 2011
    Posts
    9
    Member #
    27069
    That didn't work for me. I completely took the tables out just to test it, and there was no resolution.

    Thanks for the advice anyway though.


    Quote Originally Posted by surfbouy, post: 202352
    Hey digitalintrospect,
    I think the trouble lies in one of your tables.
    If you make the left: 0px the extra space goes away, then you could add a float etc. to fix it's position
    table#infonav {
    height: 100px;
    left: 0px;
    position: relative;
    top: 290px;
    width: 300px;
    display: inline;
    float: right;
    padding-right: 400px;
    }
    Your other option would be to make it a nested table...
    and we all know we shouldn't use tables for layout but it will be the simplest as you have already done this for the site..
    Cheers
    hope it helps


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
  •  

Search tags for this page

extra space in firefox on right of ad

Click on a term to search for related topics.
All times are GMT -6. The time now is 03:40 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com