Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8
  1. #1
    New Coder
    Join Date
    Oct 2009
    Posts
    18
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Background-image not showing, no matter what I do!

    I am rewriting the css for a spreadshirt shop to incorporate it into my own site. I'm having this pesky issue I'd think should be easy to solve, but no....

    I can't get the background image to show up in any browser. Experimenting, I've gotten a background color to show up in the input in question, looks fine, but no background image... I'm stuck, please help, thanks.

    Here's the CSS code:

    Code:
    .checkout-v2 #basketItems .basketDelete input
    {
    	position:relative !important;
    	left:-40px !important;
    	line-height:16px !important;
    	height:16px !important;
    	width:16px !important;
    /*	margin:0.5em 0.5em 0 -1.5em !important; */
    	padding:0 !important;
    	top:1.3em !important;
    	background-color:#FFF;
    	background-image: url(http://www.spreadshirt.com/Public/Common/images/Icons/icon_delete.png) !important;
    	background-repeat: no-repeat;
    }
    ... and here's the source code related to the input in question:

    Code:
    <form id="frm3853415" action="https://katabasis.spreadshirt.com/us/US/Shop/Basket/update" method="post" class="basketDelete">
    <input name="basketitem[basketitem_id]" value="3853415" type="hidden">
    <a title="Delete" class="button delete" href="">Delete</a><input style="width: 0px; height: 0px; position: absolute; left: -10000px;" title="Delete" value="Delete" name="remove" class="button delete" type="submit">
    </form>
    Incidentally, I can't make any changes to the source, only the css, since I'm working with what Spreadshirt already has up, and fitting it to my site. I'm also using the !important tags here because I'm overriding the inline style, again without wanting to alter the source code.

    Thanks in advance for your help.

  • #2
    Senior Coder
    Join Date
    Feb 2009
    Location
    Ilkley, West Yorkshire, UK
    Posts
    2,950
    Thanks
    9
    Thanked 724 Times in 718 Posts
    I guess it might be that negative left property that's causing the problem, but can you provide a link to your page?

  • #3
    Senior Coder Rowsdower!'s Avatar
    Join Date
    Oct 2008
    Location
    Some say it's everything.
    Posts
    2,027
    Thanks
    5
    Thanked 397 Times in 390 Posts
    Yep, we really need to see your test page (or at a minimum your full source code) to know for sure.

    Right now if I add an item to the cart and then view your current checkout system I can insert the CSS you have above into the code and remove the ".checkout-v2" part. When I do that I see your input element's trash can icon appearing to the left of the <a> element (also with a trash can icon). Unless your v2 checkout system is vastly different from what is publicly visible right now I think that your code should be working - or at least very close to workin - but without actually seeing it we can't provide any concrete assistance.
    The object of opening the mind, as of opening the mouth, is to shut it again on something solid. G.K. Chesterton
    See Mediocrity in its Infancy
    It's usually a good idea to start out with this at the VERY TOP of your CSS: * {border:0;margin:0;padding:0;}
    Seek and you shall find... basically:
    validate your markup | view your page cross-browser/cross-platform | free web tutorials | free hosting

  • #4
    New Coder
    Join Date
    Oct 2009
    Posts
    18
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Thanks... I made changes to the css based on your recommendations, still not working. I changed "left: -40px" to "right:0". I also took out the ".checkout-v2" to test and it made no difference. I tried applying the css above to the <a> instead of the <input> and it's behaving exactly the same. In fact now even with the "background-color:#000" applied, the background color is not showing.

    Here's the link. http://katabasis.spreadshirt.com. It looks funky, you can't see the text because it's white on white (it's going in a transparent iFrame). Go ahead and add a product to the cart, then you see this page. (To remove the item, find where the pointer cursor comes up on the right, under the top "proceed to purchase" button... the link works, just no image!).

    Here's source for the test page I've been using (some content removed to fit char limits on this forum. For the source in action, go to web-sniffer.net and drop in the real cart page url):

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml"><head>
    
    <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7">
    <title>Purchase - Your Cart | Katabasis</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <meta http-equiv="content-language" content="en">
    <meta name="language" content="en">
    
    <link rel="stylesheet" href="Purchase%20-%20Your%20Cart%20_%20Sample_files/checkout.css" type="text/css" media="screen">
    <link rel="stylesheet" href="Purchase%20-%20Your%20Cart%20_%20Sample_files/knowledgebase.css" type="text/css" media="screen">
    
    <meta name="description" content="">
    <meta name="robots" content="index, follow"><!-- includes -->
    <script type="text/javascript" src="Purchase%20-%20Your%20Cart%20_%20Sample_files/prototype.js"></script>
    <script type="text/javascript" src="Purchase%20-%20Your%20Cart%20_%20Sample_files/scriptaculous.js"></script><script type="text/javascript" src="Purchase%20-%20Your%20Cart%20_%20Sample_files/effects.js"></script>
    <script type="text/javascript" src="Purchase%20-%20Your%20Cart%20_%20Sample_files/sweetTitles.js"></script>
    <script type="text/javascript" src="Purchase%20-%20Your%20Cart%20_%20Sample_files/tabs.js"></script>
    <script type="text/javascript" src="Purchase%20-%20Your%20Cart%20_%20Sample_files/basket.js"></script>
    <script type="text/javascript" src="Purchase%20-%20Your%20Cart%20_%20Sample_files/ibox.js"></script>
    
    <script type="text/javascript" src="Purchase%20-%20Your%20Cart%20_%20Sample_files/common.js"></script>
    <script type="text/javascript" src="Purchase%20-%20Your%20Cart%20_%20Sample_files/filter.js"></script>
    <script type="text/javascript" src="Purchase%20-%20Your%20Cart%20_%20Sample_files/scripts.js"></script>
    <script type="text/javascript" language="javascript"> var AjaxUrl = 'https://katabasis.spreadshirt.com/us/US/Ajax/';</script>
    <!--[if lt IE 7]><script language="javascript" type="text/javascript" src="https://katabasis.spreadshirt.com/Public/Shop/Js/transparencyFix.js"></script><![endif]-->
    
     
    <link rel="stylesheet" href="../CSS/buttonset.css" type="text/css" />
    <link rel="stylesheet" href="../CSS/navigationset.css" type="text/css" />
    <link rel="stylesheet" href="../CSS/shop.css" type="text/css" />
    
    </head><body class=" mvc ">
    
    <div id="main" class="container">
    
    <div id="content" class="checkout-v2"><div class="section">
    <script type="text/javascript" src="Purchase%20-%20Your%20Cart%20_%20Sample_files/checkoutBasket.js"></script>
    <div id="basketItems" class="content ">
    <div class="checkoutInfoProceed">
    <div class="info-wrapper">
    <div class="checkoutInformationBox">
    <h1>Your Cart</h1>
    <p>You can change...</p>
    
    </div>
    </div>
    </div>
    
    <div class="clear"></div>
    <form id="frmBasketSubmitTop" class="clearfix" action="#" method="post">
    <ul class="checkoutStepsTop checkoutStepsTopNoLine">
    <li class="left">
    <a title="Continue Shopping" class="button main prio2 left" href="">Continue Shopping</a><input style="width: 0px; height: 0px; position: absolute; left: -10000px;" onclick="javascript:window.location='/'; return true;" title="Continue Shopping" value="Continue Shopping" class="button main prio2 left" id="continueShoppingButtonTop" type="button">
    </li>
    <li class="right">
    <a title="Proceed to Purchase" class="button main right" href="../SpreadshirtAddressPage/Purchase - Address Information _ Katabasis.htm">Proceed to Purchase</a><input style="width: 0px; height: 0px; position: absolute; left: -10000px;" onclick="javascript:document.getElementById('frmProceed').submit(); return true;" title="Proceed to Purchase" value="Proceed to Purchase" class="button main right" type="button">
    </li>
    </ul>
    </form>
    <form id="frm3853415" action="https://katabasis.spreadshirt.com/us/US/Shop/Basket/update" method="post" class="basketDelete">
    <input name="basketitem[basketitem_id]" value="3853415" type="hidden">
    <a title="Delete" class="button delete" href="">Delete</a><input style="width: 0px; height: 0px; position: absolute; left: -10000px;" title="Delete" value="Delete" name="remove" class="button delete" type="submit">
    </form>
    <form id="frmBasketUpdate3853415" action="https://katabasis.spreadshirt.com/us/US/Shop/Basket/update" method="post">
    <fieldset class="basketListArticles">
    <input name="update" value="true" type="hidden">
    <input name="basketitem[basketitem_id]" value="3853415" type="hidden">
    <h2>Men's Lightweight AA Ringer Tee&nbsp;</h2><br>
    <ul class="basketColumn ">
    <li class="basketProducttype">
    <label>Product Type</label>
    <span>Men's Lightweight AA Ringer Tee</span></li>
    <li class="basketColor">
    <label>Color</label>
    <span><img src="Purchase%20-%20Your%20Cart%20_%20Sample_files/54.gif" alt="" title="black/white" border="1"></span></li>
    <li class="basketSize">
    <label>Size</label>
    <span>
    <select id="basketitem[size]" name="basketitem[size]" onchange="this.form.submit()" class="small-select">
    <option value="2">S</option><option value="3">M</option><option value="4" selected="selected">L</option><option value="5">XL</option><option value="6">XXL</option>
    </select>
    </span></li>
    
    <li class="basketQuantity">
    <label>Amount</label>
    <span class="updateBasketItem">
    <div>
    <input id="basketitem[quantity]" name="basketitem[quantity]" value="1" size="2" maxlength="3" type="text">
    
    </div>
    <div class="checkout-float-right"><a title="Update" class="button refresh" href="">Update</a><input style="width: 0px; height: 0px; position: absolute; left: -10000px;" title="Update" value="Update" class="button refresh" type="submit"></div>
    </span>
    </li>
    <li class="basketPrice">
    <label>Price</label>
    <span>$ 17.40</span></li>
    <li class="basketPriceTotal">
    <label>Total</label>
    <span>$ 17.40</span></li>
    </ul>
    <div class="thumb-edit">
    <span id="thumbLnk3853415" title="T-Shirts - Men's Lightweight AA Ringer Tee" class="thumb">
    <img src="Purchase%20-%20Your%20Cart%20_%20Sample_files/130_002.png" alt="" title="Front" class="pimg" id="thumbImg3853415" border="0" height="130" width="130">
    </span>
    <a href="http://katabasis.spreadshirt.com/us/US/Shop/Article/Index/article/4687030/basketItem/3853415" title="T-Shirts - Men's Lightweight AA Ringer Tee" class="editBasketItem">Change</a>
    </div>
    <div class="basketArticleImages">
    <a id="basketArticleViewLink3853415_218" class="borderCurrent" href="javascript:writeImageThumb('https://katabasis.spreadshirt.com/us/US/',%20439717,%204902551,%203853415,%20121,%2054,%20218,%201,%200);" title="Details"><img src="Purchase%20-%20Your%20Cart%20_%20Sample_files/42_002.png" alt="" title="Front" class="pimg" id="thumbImg3853415218" border="0" height="42" width="42"><script type="text/javascript">
    updateImageTag("https://image.spreadshirt.com/image-server/image/product/4902551/view/1/producttypecolor/54/type/png/width/42/height/42", "thumbImg3853415218", 5, "http://katabasis.spreadshirt.com/Public/Common/images/loading_ani_130_130.gif", "/us/US/")
    </script></a><a id="basketArticleViewLink3853415_219" class="" href="javascript:writeImageThumb('https://katabasis.spreadshirt.com/us/US/',%20439717,%204902551,%203853415,%20121,%2054,%20219,%202,%200);" title="Details"><img src="Purchase%20-%20Your%20Cart%20_%20Sample_files/42_005.png" alt="" title="Back" class="pimg" id="thumbImg3853415219" border="0" height="42" width="42"><script type="text/javascript">
    updateImageTag("https://image.spreadshirt.com/image-server/image/product/4902551/view/2/producttypecolor/54/type/png/width/42/height/42", "thumbImg3853415219", 5, "http://katabasis.spreadshirt.com/Public/Common/images/loading_ani_130_130.gif", "/us/US/")
    </script></a><a id="basketArticleViewLink3853415_472" class="" href="javascript:writeImageThumb('https://katabasis.spreadshirt.com/us/US/',%20439717,%204902551,%203853415,%20121,%2054,%20472,%203,%200);" title="Details"><img src="Purchase%20-%20Your%20Cart%20_%20Sample_files/42_008.png" alt="" title="Right" class="pimg" id="thumbImg3853415472" border="0" height="42" width="42"><script type="text/javascript">
    updateImageTag("https://image.spreadshirt.com/image-server/image/product/4902551/view/3/producttypecolor/54/type/png/width/42/height/42", "thumbImg3853415472", 5, "http://katabasis.spreadshirt.com/Public/Common/images/loading_ani_130_130.gif", "/us/US/")
    </script></a><a id="basketArticleViewLink3853415_473" class="" href="javascript:writeImageThumb('https://katabasis.spreadshirt.com/us/US/',%20439717,%204902551,%203853415,%20121,%2054,%20473,%204,%200);" title="Details"><img src="Purchase%20-%20Your%20Cart%20_%20Sample_files/42.png" alt="" title="Left" class="pimg" id="thumbImg3853415473" border="0" height="42" width="42"><script type="text/javascript">
    updateImageTag("https://image.spreadshirt.com/image-server/image/product/4902551/view/4/producttypecolor/54/type/png/width/42/height/42", "thumbImg3853415473", 5, "http://katabasis.spreadshirt.com/Public/Common/images/loading_ani_130_130.gif", "/us/US/")
    </script></a>
    </div>
    <div class="basketItemViewConfig" id="basketItemViewConfig3853415_218">
    <dl>
    
    
    </dl>
    </div><div class="basketItemViewConfig" id="basketItemViewConfig3853415_219">
    <dl>
    
    
    </dl>
    </div><div class="basketItemViewConfig" id="basketItemViewConfig3853415_472">
    <dl>
    
    
    </dl>
    </div><div class="basketItemViewConfig" id="basketItemViewConfig3853415_473">
    <dl>
    
    
    </dl>
    </div>
    <div class="clear">
    </div>
    </fieldset>
    </form>
    <br><form id="frmBasketDelete3778243" action="https://katabasis.spreadshirt.com/us/US/Shop/Basket/update" method="post" class="basketDelete">
    <input name="basketitem[basketitem_id]" value="3778243" type="hidden">
    <a title="Delete" class="button delete" href="">Delete</a><input style="width: 0px; height: 0px; position: absolute; left: -10000px;" title="Delete" value="Delete" name="remove" class="button delete" type="submit">
    </form>
    <form id="frmBasketUpdate3778243" action="https://katabasis.spreadshirt.com/us/US/Shop/Basket/update" method="post">
    <fieldset class="basketListArticles">
    <input name="update" value="true" type="hidden">
    <input name="basketitem[basketitem_id]" value="3778243" type="hidden">
    <h2>Men's Heavyweight T-Shirt&nbsp;</h2><br>
    <ul class="basketColumn ">
    <li class="basketProducttype">
    <label>Product Type</label>
    <span>Men's Heavy...</span></li>
    <li class="basketColor">
    <label>Color</label>
    <span><img src="Purchase%20-%20Your%20Cart%20_%20Sample_files/94.gif" alt="" title="chocolate" border="1"></span></li>
    <li class="basketSize">
    <label>Size</label>
    <span>
    <select id="basketitem[size]" name="basketitem[size]" onchange="this.form.submit()" class="small-select">
    <option value="2">S</option><option value="3" selected="selected">M</option><option value="4">L</option><option value="5">XL</option><option value="6">XXL</option>
    </select>
    </span></li>
    
    <li class="basketQuantity">
    <label>Amount</label>
    <span class="updateBasketItem">
    <div>
    <input id="basketitem[quantity]" name="basketitem[quantity]" value="1" size="2" maxlength="3" type="text">
    
    </div>
    <div class="checkout-float-right"><a title="Update" class="button refresh" href="">Update</a><input style="width: 0px; height: 0px; position: absolute; left: -10000px;" title="Update" value="Update" class="button refresh" type="submit"></div>
    </span>
    </li>
    <li class="basketPrice">
    <label>Price</label>
    <span>$ 14.40</span></li>
    <li class="basketPriceTotal">
    <label>Total</label>
    <span>$ 14.40</span></li>
    </ul>
    <div class="thumb-edit">
    <span id="thumbLnk3778243" title="T-Shirts - Men's Heavyweight T-Shirt" class="thumb">
    <img src="Purchase%20-%20Your%20Cart%20_%20Sample_files/130.png" alt="" title="Front" class="pimg" id="thumbImg3778243" border="0" height="130" width="130">
    </span>
    <a href="http://katabasis.spreadshirt.com/us/US/Shop/Article/Index/article/4683894/basketItem/3778243" title="T-Shirts - Men's Heavyweight T-Shirt" class="editBasketItem">Change</a>
    </div>
    <div class="basketArticleImages">
    <a id="basketArticleViewLink3778243_181" class="borderCurrent" href="javascript:writeImageThumb('https://katabasis.spreadshirt.com/us/US/',%20439717,%204900034,%203778243,%20109,%2094,%20181,%201,%200);" title="Details"><img src="Purchase%20-%20Your%20Cart%20_%20Sample_files/42_007.png" alt="" title="Front" class="pimg" id="thumbImg3778243181" border="0" height="42" width="42"><script type="text/javascript">
    updateImageTag("https://image.spreadshirt.com/image-server/image/product/4900034/view/1/producttypecolor/94/type/png/width/42/height/42", "thumbImg3778243181", 5, "http://katabasis.spreadshirt.com/Public/Common/images/loading_ani_130_130.gif", "/us/US/")
    </script></a><a id="basketArticleViewLink3778243_182" class="" href="javascript:writeImageThumb('https://katabasis.spreadshirt.com/us/US/',%20439717,%204900034,%203778243,%20109,%2094,%20182,%202,%200);" title="Details"><img src="Purchase%20-%20Your%20Cart%20_%20Sample_files/42_003.png" alt="" title="Back" class="pimg" id="thumbImg3778243182" border="0" height="42" width="42"><script type="text/javascript">
    updateImageTag("https://image.spreadshirt.com/image-server/image/product/4900034/view/2/producttypecolor/94/type/png/width/42/height/42", "thumbImg3778243182", 5, "http://katabasis.spreadshirt.com/Public/Common/images/loading_ani_130_130.gif", "/us/US/")
    </script></a><a id="basketArticleViewLink3778243_470" class="" href="javascript:writeImageThumb('https://katabasis.spreadshirt.com/us/US/',%20439717,%204900034,%203778243,%20109,%2094,%20470,%203,%200);" title="Details"><img src="Purchase%20-%20Your%20Cart%20_%20Sample_files/42_004.png" alt="" title="Right" class="pimg" id="thumbImg3778243470" border="0" height="42" width="42"><script type="text/javascript">
    updateImageTag("https://image.spreadshirt.com/image-server/image/product/4900034/view/3/producttypecolor/94/type/png/width/42/height/42", "thumbImg3778243470", 5, "http://katabasis.spreadshirt.com/Public/Common/images/loading_ani_130_130.gif", "/us/US/")
    </script></a><a id="basketArticleViewLink3778243_471" class="" href="javascript:writeImageThumb('https://katabasis.spreadshirt.com/us/US/',%20439717,%204900034,%203778243,%20109,%2094,%20471,%204,%200);" title="Details"><img src="Purchase%20-%20Your%20Cart%20_%20Sample_files/42_006.png" alt="" title="Left" class="pimg" id="thumbImg3778243471" border="0" height="42" width="42"><script type="text/javascript">
    updateImageTag("https://image.spreadshirt.com/image-server/image/product/4900034/view/4/producttypecolor/94/type/png/width/42/height/42", "thumbImg3778243471", 5, "http://katabasis.spreadshirt.com/Public/Common/images/loading_ani_130_130.gif", "/us/US/")
    </script></a>
    </div>
    <div class="basketItemViewConfig" id="basketItemViewConfig3778243_181">
    <dl>
    
    
    </dl>
    </div><div class="basketItemViewConfig" id="basketItemViewConfig3778243_182">
    <dl>
    
    
    </dl>
    </div><div class="basketItemViewConfig" id="basketItemViewConfig3778243_470">
    <dl>
    
    
    </dl>
    </div><div class="basketItemViewConfig" id="basketItemViewConfig3778243_471">
    <dl>
    
    
    </dl>
    </div>
    <div class="clear">
    </div>
    </fieldset>
    </form>
    <br>
    <fieldset class="basketAdditionals">
    <form action="https://katabasis.spreadshirt.com/us/US/Shop/Basket/coupon/unilink/169/" id="frmProceed" method="post">
    <input name="" value="8e11b1e2c598ab11219066c89a8f7e7f" type="hidden">
    
    <div id="basketCouponCode" class="clearfix">
    <div>
    <label for="couponCode"><strong> Coupon</strong></label>
    <span>
    <input id="couponCode" name="coupon_code" size="18" maxlength="32" type="text">
    <input id="couponAction" name="couponAction" value="0" type="hidden">
    <a href="#" onclick="javascript:document.getElementById('couponAction').value = '1';document.getElementById('frmProceed').submit();" title="Click to redeem your coupon">Click to redeem your coupon</a>
    <small>Please click the text to the right to redeem a coupon code! 
    *Only one coupon per order. </small>
    </span>
    </div>
    </div>
    
    
    <div id="basketShippingPrice" class="clearfix">
    <div>
    <label><strong>Delivery Costs</strong></label>
    <span>
    <div class="shipping-info">
    
    <small>Applicable for deliveries...</small>
    </div>
    <strong>+ $ 4.50</strong>
    </span>
    </div>
    </div>
    
    
    
    <div id="basketPriceTotal" class="clearfix">
    <div class="additonalShippingPrice" style="display: none;">
    <label><strong>Delivery Costs</strong></label>
    <span><strong class="price-higlihted">+ $ 4.50</strong></span>
    </div>
    <div>
    <label><strong>Total</strong></label>
    <span><strong class="price-higlihted">$ 39.80</strong></span>
    
    </div>
    </div>
    
    </form>
    </fieldset>
    
    
    
    </div>
    
    <script type="text/javascript">
    
    </script>
    
    </div><div id="menuFooter">
    </div>
    
    <script type="text/javascript" language="javascript">
    document.getElementsByTagName('body')[0].className += ' mvc ';
    </script>
    </div>
    </div>
    
    <!-- SiteCatalyst code version: H.14.-->
    <script type="text/javascript"><!--
    var s_account = "spreadshirt-com-en"
    //--></script>
    <script type="text/javascript" src="Purchase%20-%20Your%20Cart%20_%20Sample_files/s_code.js"></script>
    <script type="text/javascript"><!--
    s.trackingServer = "analytics.spreadshirt.com"
    s.trackingServerSecure = "sanalytics.spreadshirt.com"
    s.server = "162263.spreadshirt.com"
    s.currencyCode = "USD"
    s.eVar13 = "classic_compact - classic - 1/828/structure.css"
    s.prop25 = "classic_compact - classic - 1/828/structure.css"
    s.eVar8 = "logged in - shoppartner"
    s.eVar7 = "m"
    s.events = "scAdd, scView"
    s.eVar20 = "Product added"
    s.eVar33 = "us-US - 162263 - Katabasis"
    s.prop31 = "Standard - Checkout - Basket"
    s.pageName = "us - US - Checkout - 162263 - Katabasis - Basket"
    s.channel = "Checkout"
    s.prop1 = "Checkout - Basket"
    s.eVar28 = "2"
    s.eVar29 = "2"
    s.products = "us - US - 162263 - Katabasis;us - US - 162263 - Katabasis - 4687030 - Men%27s Lightweight AA Ringer Tee"
    if('undefined' != typeof confomatLoaded) {
        if(confomatLoaded) {
            if(s.events != "") {
                s.events = s.events + ",event1";
            } else {
                s.events="event1";
            }
        } else {
            s.eVar39 = "Flash Installer loaded";
        }
    }
    /************* DO NOT ALTER ANYTHING BELOW! */
    var s_code=s.t();if(s_code)document.write(s_code)//--></script>
    <script type="text/javascript"><!--
    if(navigator.appVersion.indexOf('MSIE')>=0)document.write(unescape('%3C')+'\!-'+'-')
    //--></script><noscript><img src="https://sanalytics.spreadshirt.com/b/ss/spreadshirt-com-en/1/H.14--NS/0" height="1" width="1" alt="" /></noscript>
    <!-- End SiteCatalyst code version: H.14. -->
    <div id="ibox"><div id="ibox_w" style="display: none;"></div><div id="ibox_progress" style="display: none;">&nbsp;</div><div id="ibox_wrapper" style="display: none;"><div id="ibox_content"><div id="ibox_close"><a id="ibox_close_a" href="#">x</a></div><div id="i_con"></div></div></div></div></body></html>

  • #5
    Senior Coder
    Join Date
    Feb 2009
    Location
    Ilkley, West Yorkshire, UK
    Posts
    2,950
    Thanks
    9
    Thanked 724 Times in 718 Posts
    There's two things I think. Having clicked on all the invisible buttons...

    You then have:

    Code:
    <a title="Delete" class="button delete" href="">Delete</a><input style="width: 0px; height: 0px; position: absolute; left: -10000px;" title="Delete" value="Delete" name="remove" class="button delete" type="submit">
    </form>
    So the (invisible) button isn't on the page. Having amended this in Firebug still no image - because your css is:

    Code:
    background-image:url(www.spreadshirt.com/Public/Common/images/Icons/icon_delete.png);
    which should be

    Code:
    background-image:url(http://www.spreadshirt.com/Public/Common/images/Icons/icon_delete.png);
    Have a try with that.

  • #6
    Senior Coder Rowsdower!'s Avatar
    Join Date
    Oct 2008
    Location
    Some say it's everything.
    Posts
    2,027
    Thanks
    5
    Thanked 397 Times in 390 Posts
    Quote Originally Posted by SB65 View Post
    There's two things I think. Having clicked on all the invisible buttons...

    You then have:

    Code:
    <a title="Delete" class="button delete" href="">Delete</a><input style="width: 0px; height: 0px; position: absolute; left: -10000px;" title="Delete" value="Delete" name="remove" class="button delete" type="submit">
    </form>
    So the (invisible) button isn't on the page. Having amended this in Firebug still no image - because your css is:

    Code:
    background-image:url(www.spreadshirt.com/Public/Common/images/Icons/icon_delete.png);
    which should be

    Code:
    background-image:url(http://www.spreadshirt.com/Public/Common/images/Icons/icon_delete.png);
    Have a try with that.
    Yep, exactly what he said!
    The object of opening the mind, as of opening the mouth, is to shut it again on something solid. G.K. Chesterton
    See Mediocrity in its Infancy
    It's usually a good idea to start out with this at the VERY TOP of your CSS: * {border:0;margin:0;padding:0;}
    Seek and you shall find... basically:
    validate your markup | view your page cross-browser/cross-platform | free web tutorials | free hosting

  • #7
    New Coder
    Join Date
    Oct 2009
    Posts
    18
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Problem solved, thanks guys!

    A bit funky on the solution, here's the css:

    Code:
    .button.delete {
    	border:0;
            text-indent:-1000em;     /* MODIFIED - was -1000em; */
    	cursor:pointer;
    	height:20px !important;
    	width:20px !important;
            background-position:0 0;
    	background-image: url(/Public/Common/images/Icons/icon_delete.png); 
            background-repeat:no-repeat;
            left:0 !important;
    }
    
    ...
    
    .checkout-v2 #basketItems .basketDelete input
    {
    	position:relative !important;
    	right:0 !important;
    	height:16px !important;
    	width:16px !important;
    	padding:0 !important;
            margin:0 !important;
    	background-image: url(/Public/Common/images/Icons/icon_delete.png); 
            background-repeat: no-repeat;
    }
    For some strange reason the background image must be declared in both places. It did not work if I deleted it in one OR the other. Any ideas why this might be would be helpful, otherwise, problem solved.

  • #8
    Senior Coder Rowsdower!'s Avatar
    Join Date
    Oct 2008
    Location
    Some say it's everything.
    Posts
    2,027
    Thanks
    5
    Thanked 397 Times in 390 Posts
    It works for me in Firebug when I remove the background image style from .button.delete so I'm not sure what problem you are seeing. The other style should be overriding anything you put in .button.delete anyway so there is no way that removing it there should be causing a problem.

    Were you just commenting out the lines or what? Which browser(s) were not showing the background image anymore?
    The object of opening the mind, as of opening the mouth, is to shut it again on something solid. G.K. Chesterton
    See Mediocrity in its Infancy
    It's usually a good idea to start out with this at the VERY TOP of your CSS: * {border:0;margin:0;padding:0;}
    Seek and you shall find... basically:
    validate your markup | view your page cross-browser/cross-platform | free web tutorials | free hosting


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •