Solved

make borders appear

Posted on 2011-10-01
23
377 Views
Last Modified: 2012-05-12
in previous questions I got answers about border-radius.htc tutorials

Now I am providing the source code from a content management system that has many files attached

in ie8 and below there are no borders around the images and I want to know why

How can I edit this code to make the borders appear

http://imagesretrospective.com/sourceindex8a.html


please click on related question
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
       "http://www.w3.org/TR/html4/strict.dtd">

    <head>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="google-site-verification" content="-mh_a7ey_YUusKV_sFKNlxlPxAP-zDSvzEGBYvvOBCc" />
      <title>Need curved borders</title>
      <!-- Framework CSS -->
      <link rel="stylesheet" href="css/screen.css" type="text/css" media="screen, projection,print">
    
    <!--begin ukdc-->
    <link href="css/template.css" rel="stylesheet" type="text/css" />

    <link href="css/productdetails.css" rel="stylesheet" type="text/css" />
    <link href="css/bundles.css" rel="stylesheet" type="text/css" />
    <!--end ukdc--></head>
    <body>
    <div class="container">
        <div class="PYXHEADER">
            <div class="PYXNAVIGATION">
              <a href="myaccount.php">My Account</a>
                <a href="myaccount.php">Track Your Order</a>
                <a href="contact.php">Contact Us</a>
                <a href="aboutus.php">About Us</a>
        <a style="background:url(../siteimg/cart.gif) no-repeat left;padding-left:23px;" href="/cart">My Cart (0 ITEMS)</a>
            </div>
      


&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

        </div>
    
    <div class="PYXSECTIONS"><a href="category.php?cat=4"><img src="siteimg/digital-slrs.gif"></a><a href="category.php?cat=14"><img src="siteimg/digital-compacts.gif"></a><a href="category.php?cat=6"><img src="siteimg/lenses.gif"></a><a href="category.php?cat=2"><img src="siteimg/camcorders.gif"></a><a href="category.php?cat=73"><img src="siteimg/camera-bundles.gif"></a><a href="category.php?cat=69"><img src="siteimg/accessories.gif"></a></div>

    <div class="PYXSEARCH">
      <div class="searchForm">
      <form action="search.php" method="GET">
       

        <img src="siteimg/search.gif" style="float:left;margin-top:5px;margin-right:10px;"/> <input type="text" name="txt" value="Keyword or item#" onfocus="this.value='';" class="emailTxtBox" id="txt" /><input type="image" src="siteimg/newsletter-go.gif" />
      </form>
      </div>
    </div>    
    
        <div class="container PYXITEMAREA"><div style="height:20px">&nbsp;</div><style type="text/css"> .recommended{display:block} .recommended * { display:block; height:1px; overflow:hidden; font-size:.01em; background:#f4f4f4;} .recommended1{ margin-left:3px; margin-right:3px; padding-left:1px; padding-right:1px; border-left:1px solid #fafafa; border-right:1px solid #fafafa; background:#f6f6f6;} .recommended2{ margin-left:1px; margin-right:1px; padding-right:1px; padding-left:1px; border-left:1px solid #fdfdfd; border-right:1px solid #fdfdfd; background:#f6f6f6;} .recommended3{ margin-left:1px; margin-right:1px; border-left:1px solid #f6f6f6; border-right:1px solid #f6f6f6;} .recommended4{ border-left:1px solid #fafafa; border-right:1px solid #fafafa;} .recommended5{ border-left:1px solid #f6f6f6; border-right:1px solid #f6f6f6;} .recommendedfg{ background:#f4f4f4;}
.recommendedfg table tr td {padding:0 3px 0 0;color:#363636;font-weight:bold;font-family:Verdana;font-size:10px;}
.recommendedfg {  }
.homesmallicon { width:232px; margin-right:5px; float:left; }
.homesmalliconlast { width:230px; float:left; }
.checkmarktalble table tr td { padding:10px 3px 0 0; }

</style>  
  <!-- Left Column  -->
  <div style="width:229px; float:left; padding:5px;">
  
  <div style="width:224px;">
    <b class="recommended"><b class="recommended1"><b></b></b><b class="recommended2"><b></b></b><b class="recommended3"></b><b class="recommended4"></b><b class="recommended5"></b></b>
  
    <div class="recommendedfg" style="padding:0px 0px;">
    <div align="center"><img src="siteimg/customer_support_b1.jpg"></div>
    <div align="center"><img src="homepageselections/free_delivery.jpg"></div>
    <div align="center"><img src="homepageselections/free-3-yr-warranty.jpg"></div>
    <div align="center"><img src="homepageselections/15-day-moneyback.jpg"></div>
    <div align="center"><img src="homepageselections/stay-connected.gif"></div>




    
    
    
    
    
    
    
    
    
    

    </div>


    
  </div>

  
  </div>
  <!-- END Left Column -->
 
  <!-- Right Column  -->
  <div style="width:704px; float:left; padding:5px 0;">
   
<!--<img src="siteimg/mainbanner.jpg">     -->
   
   
   
   
   
   
   
   
   
<style>
img{border:0px;}
/*Homepage Slideshow */
.homepageSpecials{
    float:left;
    margin-bottom:6px;
}

#slideshowL{
    position:relative;
    z-index:0;
    height:281px;
    width:704px;
    border:0px;
    overflow:hidden;
}

#navslide {    
    position:absolute;
    margin-top:-25px;  
    text-align:right;
    width:680px; 
    height:20px;
    padding-right:10px; 
}

#navslide a {

    background: url(images/slider_inactive.png) no-repeat center;
    font-weight: bold;
    outline:none;
    padding:8px;
    text-decoration: none;
    color: #ffffff; 
}

#navslide a:hover {

    background: url(images/slider_over.png) no-repeat center;

}
#navslide a.activeSlide {            


    background: url(images/slider_active.png) no-repeat center;
    font-weight: bold;
    color: #ffffff; }
    
#navslide a:focus { outline: none; }
/*Homepage Slideshow */
</style>

<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.cycle.all.2.72.js"></script>
<script type="text/javascript" src="js/jquery.easing.1.1.1.js"></script>
<script type="text/javascript"> 

$(document).ready(function() {
    
    $('#slideshowL').after('<div id="navslide">').cycle({
        fx:     'fade',
        speed:  'slow',
        timeout: 5000,
        pager:  '#navslide'
        
    });
});
 
</script>




<div class="homepageSpecials">
    <div id="slideshowL">
    
        <a href="item.php?item_id=151944"><img src="images/blackberry-playbook.jpg" alt="Blacberry Playbook Tablet PC" /></a>
        <a href="search.php?txt=Canon+EOS+7D&x=14&y=19"><img src="images/canon-eos-7d.jpg" alt="Canon EOS 7D" /></a>
        <a href="search.php?txt=ipod+touch&x=0&y=0"><img src="images/apple-ipod-touch.jpg" alt="Apple Ipod Touch" /></a>
        <a href="item.php?item_id=151953"><img src="images/nikon-d5100.jpg" alt="Nikon D5100" /></a>
        <a href="search.php?txt=canon+slr+lens&x=32&y=15"><img src="images/canon-slr-lenses.jpg" alt="Best selection on Canon SLR Lenses" /></a>
        <a href="search.php?txt=digital+camera&x=32&y=15"><img src="images/summer-deals-digital-cameras.jpg" alt="Hot summer Deals on Digital Cameras" /></a>
    </div>
</div>   
   
   <div style="clear:both"></div>
            <div style="height:25px;padding-top:6px;padding-left:10px;width:695px;margin:0px;line-height:normal; color:#000000; font-weight:bold; font-size:13px;background:url(siteimg/searchresults_bg.gif) no-repeat;">Top Picks:</div>   
   <div style="clear:both"></div>
   
   
<style> 
#product {
float:left;
behavior: url(border-radius.htc);
margin:5px 5px;
border-radius: 15px 15px 15px 15px;
-moz-border-radius:15px 15px 15px 15px;
-webkit-border-radius:15px 15px 15px 15px;
border:1px solid #999;
background: white;
width:162px;
height:190px;
/*font-size: 12px;*/
}

#product .title{
  color:#9aa0a2;
  /*font-weight:bold;*/
  text-align:left;
  margin:3px;
}
#product img{
  margin:5px 15%;
}
#product .price{
  text-align:center;
  margin-top:10px;
  color:#02aff0; 
  font-weight:bold; 
  font-size:21px;
}
#wrap {width: 704px; margin: 0 auto;}
</style>


<div id="wrap">
<a href="item.php?item_id=149876">
<div id="product">
  <div class="title">Canon EOS 60D<br>DSLR Body</div>
  <img src="homepageselections/canon-eos-60d.gif" alt="canon-eos-60d">
  <div class="price">&pound;719 inc VAT</div>
</div>
</a>
<a href="search.php?txt=55-250&x=35&y=14">
<div id="product">
  <div class="title">Canon 55-250mm IS Lens<br>&nbsp;</div>
  <img src="homepageselections/canon-is-lens.gif" alt="canon-is-lens" />
  <div class="price">&pound;139 inc VAT</div>
</div>
</a>
<a href="item.php?item_id=151546">
<div id="product">
  <div class="title">Canon EOS T2i/ EOS 550D<br>with 18-55mm IS Lens</div>
  <img src="homepageselections/canon-550d.gif" alt="canon-550d" />
  <div class="price">&pound;549 inc VAT</div>
</div>
</a>
<a href="item.php?item_id=151588">
<div id="product">
  <div class="title">Nikon D7000 Body<br>&nbsp;</div>
  <img src="homepageselections/nikon-d7000.gif" alt="nikon-d7000" />
  <div class="price">&pound;859 inc VAT</div>
</div>
</a>
<a href="item.php?item_id=151938">
<div id="product">
  <div class="title">Olympus-XZ-1 Black<br>&nbsp;</div>
  <img src="homepageselections/olympus-xz-1.gif" alt="olympus-xz-1" />
  <div class="price">&pound;349 inc VAT</div>
</div>
</a>
<a href="search.php?txt=ipad&x=0&y=0">
<div id="product">
  <div class="title">Apple Ipads WiFi & 3G<br>Models Available</div>
  <img src="homepageselections/apple-ipad.gif" alt="apple-ipad" />
  <div class="price">View all</div>
</div>
</a>
<a href="search.php?txt=panasonic&x=0&y=0">
<div id="product">
  <div class="title">Get the best deals on<br>Panasonic Point & Shoot</div>
  <img src="homepageselections/panasonic-point-and-shoot.gif" alt="panasonic-point-and-shoot" />
  <div class="price">View all</div>
</div>
</a>
<a href="search.php?txt=nikon+slr+lens&x=0&y=0">
<div id="product">
  <div class="title">Best Selection of Nikon<br>SLR Lenses</div>
  <img src="homepageselections/nikon-slr-lenses.gif" alt="nikon-slr-lenses" />
  <div class="price">&pound;859 inc VAT</div>
</div>
</a>
</div>


    
    <div style="line-height: 10px">&nbsp;</div>


    
  </div>  
  

  <!-- END Right Column -->
</div><script language = "Javascript">
    function echeck(str) {
        var at="@"; var dot="."; var lat=str.indexOf(at); var lstr=str.length; var ldot=str.indexOf(dot); 
        if (str.indexOf(at)==-1){ alert("Please reenter your email address"); return false; }
        if (str.indexOf(at)==-1 || str.indexOf(at)==0 || str.indexOf(at)==lstr){ alert("Please reenter your email address"); return false; }
        if (str.indexOf(dot)==-1 || str.indexOf(dot)==0 || str.indexOf(dot)==lstr){ alert("Please reenter your email address"); return false; }
        if (str.indexOf(at,(lat+1))!=-1){ alert("Please reenter your email address"); return false; }
        if (str.substring(lat-1,lat)==dot || str.substring(lat+1,lat+2)==dot){ alert("Please reenter your email address"); return false; }
        if (str.indexOf(dot,(lat+2))==-1){ alert("Please reenter your email address"); return false; }
        if (str.indexOf(" ")!=-1){ alert("Please reenter your email address"); return false; }
        return true;
    }

    function ValidateForm(){
        var emailID=document.newslettersignup.Email
        if ((emailID.value==null)||(emailID.value=="")){ alert("Please Enter your Email ID"); emailID.focus(); return false; }
        if (echeck(emailID.value)==false){ emailID.value=""; emailID.focus(); return false; }
        return true;
    }
    </script> 
<style type="text/css">








#footer{

  color:#9aa0a2;
  padding:20px;
  padding-bottom:0px;
  padding-top:15px;
  font-family:Arial, Helvetica, sans-serif;
  font-size:11px;
  margin:0 auto;
  width:894px;
  height:190px;
  background:url(siteimg/footet-bg.gif) no-repeat; 
  

}

#footer img{
  border:0px;
}

#footer div{
  float:left;
  width:180px;
}

#footer div b{
  line-height:20px;
}

#footer div a{  line-height:17px;
  display:block;
  color:#02aff0;
}

#footer div a:hover{
  color:#9aa0a2;
}

.emailInput{
  color:#666;
  width:160px;
  padding-left:5px;
  padding-top:3px;
  height:19px;
  line-height:14px;
  font-size:11px;
  border:1px solid #9aa0a2;
  border-right:0px;
  float:left;
}







</style>
<div class="container" style="padding-top:10px;">
  <div id="footer">

    <div>
        <b>Customer Services</b><br />
           <a href="/myaccount.php">Order Tracking</a>
          <a href="termsandconditions.php#processinganddelivery">Delivery</a>
          <a href="termsandconditions.php#returnpolicy">Returns &amp; Cancellations</a>
      </div>

    <div>
          <b></b><br />
          <a href="#">How to place an order</a>
          <a href="/cart">Payment</a>
          <a href="termsandconditions.php">Terms and Conditions </a>   
      </div>

    <div style="width:150px;">
          <b>Company</b><br />
          <a href="/aboutus.php">About us</a>
          <a href="/privacypolicy.php">Security and Privacy</a>
          <a href="/contact.php">Contact Us</a>
      </div>
   
    <div style="width:150px;">
          <!--<b>Safe Shopping</b><br />-->
          <!--<a href="#"><img src="siteimg/trustedwave.gif" style="margin-bottom:5px;" /></a>
          <a href="#"><img src="siteimg/verisign.gif" /></a>-->
          

      </div>

    <div style="width:210px;">
           <img src="siteimg/newsletter-signup.gif" /><br />
          Sign up to receive our latest offers<br /><br />
          <form action="newslettersignup.php" name="newslettersignup" onSubmit="return ValidateForm()"><input type="text" style="height:20px;" name="Email" value="E-mail Address" onfocus="this.value='';" class="emailInput" /><input type="image" src="siteimg/newsletter-go.gif" style="margin-top:-1px;float:left;"/></form>
      </div>
      <br style="clear:both" />
      <div style="width:440px;">
      <span style="line-height:20px;">&copy 2011   |  All rights reserved</span><br />
      Prices, specifications, and images are subject to change without notice. 
  Not responsible for typographical or illustrative errors. Manufacturer rebates, 
  terms, conditions and expiration dates are subject to manufacturers printed forms.
      </div>
      <div style="width:450px;padding-top:10px;text-align:center;">
        <img src="siteimg/payment-methods.gif" />
        <!--<img src="siteimg/payment-methods.gif" width="440" />-->
      </div>
      
  </div>
</div>
</div>
<div class="container" style="background:none;"><img src="../siteImg/c-bot.gif" /></div></body></html>
  

  
  
<script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-21099058-1']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

</script>

Open in new window

0
Comment
Question by:rgb192
  • 12
  • 7
  • 4
23 Comments
 
LVL 16

Expert Comment

by:SSupreme
ID: 36897910
The good news is that borders are rounded (When I checked it first) but the  color of borders become transparent for some reason. That is why they cannot be seen.
0
 

Author Comment

by:rgb192
ID: 36897931
okay.  so it is not a rounded border issue

but what is that called, so I can google it, 'disappearing borders'
0
 
LVL 16

Expert Comment

by:SSupreme
ID: 36897967
I can see rounded borders in IE8. I will check what it can be caused by in IE7 and let you know.
0
 
LVL 16

Expert Comment

by:SSupreme
ID: 36898045
Try to remove scripts for a while, check does it solve it?
0
 

Author Comment

by:rgb192
ID: 36898107
http://imagesretrospective.com/test.html

i commented the large block of javacript
lines 156 to 172


and now I have square borders on ie8


I am using

http://www.my-debugbar.com/wiki/IETester/HomePage

That emulates IE 5.5 to IE 10 in one program. Works really well.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
       "http://www.w3.org/TR/html4/strict.dtd">

    <head>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="google-site-verification" content="-mh_a7ey_YUusKV_sFKNlxlPxAP-zDSvzEGBYvvOBCc" />
      <title>Need curved borders</title>
      <!-- Framework CSS -->
      <link rel="stylesheet" href="css/screen.css" type="text/css" media="screen, projection,print">
    
    <!--begin ukdc-->
    <link href="css/template.css" rel="stylesheet" type="text/css" />

    <link href="css/productdetails.css" rel="stylesheet" type="text/css" />
    <link href="css/bundles.css" rel="stylesheet" type="text/css" />
    <!--end ukdc--></head>
    <body>
    <div class="container">
        <div class="PYXHEADER">
            <div class="PYXNAVIGATION">
              <a href="myaccount.php">My Account</a>
                <a href="myaccount.php">Track Your Order</a>
                <a href="contact.php">Contact Us</a>
                <a href="aboutus.php">About Us</a>
        <a style="background:url(../siteimg/cart.gif) no-repeat left;padding-left:23px;" href="/cart">My Cart (0 ITEMS)</a>
            </div>
      


&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

        </div>
    
    <div class="PYXSECTIONS"><a href="category.php?cat=4"><img src="siteimg/digital-slrs.gif"></a><a href="category.php?cat=14"><img src="siteimg/digital-compacts.gif"></a><a href="category.php?cat=6"><img src="siteimg/lenses.gif"></a><a href="category.php?cat=2"><img src="siteimg/camcorders.gif"></a><a href="category.php?cat=73"><img src="siteimg/camera-bundles.gif"></a><a href="category.php?cat=69"><img src="siteimg/accessories.gif"></a></div>

    <div class="PYXSEARCH">
      <div class="searchForm">
      <form action="search.php" method="GET">
       

        <img src="siteimg/search.gif" style="float:left;margin-top:5px;margin-right:10px;"/> <input type="text" name="txt" value="Keyword or item#" onfocus="this.value='';" class="emailTxtBox" id="txt" /><input type="image" src="siteimg/newsletter-go.gif" />
      </form>
      </div>
    </div>    
    
        <div class="container PYXITEMAREA"><div style="height:20px">&nbsp;</div><style type="text/css"> .recommended{display:block} .recommended * { display:block; height:1px; overflow:hidden; font-size:.01em; background:#f4f4f4;} .recommended1{ margin-left:3px; margin-right:3px; padding-left:1px; padding-right:1px; border-left:1px solid #fafafa; border-right:1px solid #fafafa; background:#f6f6f6;} .recommended2{ margin-left:1px; margin-right:1px; padding-right:1px; padding-left:1px; border-left:1px solid #fdfdfd; border-right:1px solid #fdfdfd; background:#f6f6f6;} .recommended3{ margin-left:1px; margin-right:1px; border-left:1px solid #f6f6f6; border-right:1px solid #f6f6f6;} .recommended4{ border-left:1px solid #fafafa; border-right:1px solid #fafafa;} .recommended5{ border-left:1px solid #f6f6f6; border-right:1px solid #f6f6f6;} .recommendedfg{ background:#f4f4f4;}
.recommendedfg table tr td {padding:0 3px 0 0;color:#363636;font-weight:bold;font-family:Verdana;font-size:10px;}
.recommendedfg {  }
.homesmallicon { width:232px; margin-right:5px; float:left; }
.homesmalliconlast { width:230px; float:left; }
.checkmarktalble table tr td { padding:10px 3px 0 0; }

</style>  
  <!-- Left Column  -->
  <div style="width:229px; float:left; padding:5px;">
  
  <div style="width:224px;">
    <b class="recommended"><b class="recommended1"><b></b></b><b class="recommended2"><b></b></b><b class="recommended3"></b><b class="recommended4"></b><b class="recommended5"></b></b>
  
    <div class="recommendedfg" style="padding:0px 0px;">
    <div align="center"><img src="siteimg/customer_support_b1.jpg"></div>
    <div align="center"><img src="homepageselections/free_delivery.jpg"></div>
    <div align="center"><img src="homepageselections/free-3-yr-warranty.jpg"></div>
    <div align="center"><img src="homepageselections/15-day-moneyback.jpg"></div>
    <div align="center"><img src="homepageselections/stay-connected.gif"></div>




    
    
    
    
    
    
    
    
    
    

    </div>


    
  </div>

  
  </div>
  <!-- END Left Column -->
 
  <!-- Right Column  -->
  <div style="width:704px; float:left; padding:5px 0;">
   
<!--<img src="siteimg/mainbanner.jpg">     -->
   
   
   
   
   
   
   
   
   
<style>
img{border:0px;}
/*Homepage Slideshow */
.homepageSpecials{
    float:left;
    margin-bottom:6px;
}

#slideshowL{
    position:relative;
    z-index:0;
    height:281px;
    width:704px;
    border:0px;
    overflow:hidden;
}

#navslide {    
    position:absolute;
    margin-top:-25px;  
    text-align:right;
    width:680px; 
    height:20px;
    padding-right:10px; 
}

#navslide a {

    background: url(images/slider_inactive.png) no-repeat center;
    font-weight: bold;
    outline:none;
    padding:8px;
    text-decoration: none;
    color: #ffffff; 
}

#navslide a:hover {

    background: url(images/slider_over.png) no-repeat center;

}
#navslide a.activeSlide {            


    background: url(images/slider_active.png) no-repeat center;
    font-weight: bold;
    color: #ffffff; }
    
#navslide a:focus { outline: none; }
/*Homepage Slideshow */
</style>
<!--
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.cycle.all.2.72.js"></script>
<script type="text/javascript" src="js/jquery.easing.1.1.1.js"></script>
<script type="text/javascript"> 

$(document).ready(function() {
    
    $('#slideshowL').after('<div id="navslide">').cycle({
        fx:     'fade',
        speed:  'slow',
        timeout: 5000,
        pager:  '#navslide'
        
    });
});
 
</script>
-->



<div class="homepageSpecials">
    <div id="slideshowL">
    
        <a href="item.php?item_id=151944"><img src="images/blackberry-playbook.jpg" alt="Blacberry Playbook Tablet PC" /></a>
        <a href="search.php?txt=Canon+EOS+7D&x=14&y=19"><img src="images/canon-eos-7d.jpg" alt="Canon EOS 7D" /></a>
        <a href="search.php?txt=ipod+touch&x=0&y=0"><img src="images/apple-ipod-touch.jpg" alt="Apple Ipod Touch" /></a>
        <a href="item.php?item_id=151953"><img src="images/nikon-d5100.jpg" alt="Nikon D5100" /></a>
        <a href="search.php?txt=canon+slr+lens&x=32&y=15"><img src="images/canon-slr-lenses.jpg" alt="Best selection on Canon SLR Lenses" /></a>
        <a href="search.php?txt=digital+camera&x=32&y=15"><img src="images/summer-deals-digital-cameras.jpg" alt="Hot summer Deals on Digital Cameras" /></a>
    </div>
</div>   
   
   <div style="clear:both"></div>
            <div style="height:25px;padding-top:6px;padding-left:10px;width:695px;margin:0px;line-height:normal; color:#000000; font-weight:bold; font-size:13px;background:url(siteimg/searchresults_bg.gif) no-repeat;">Top Picks:</div>   
   <div style="clear:both"></div>
   
   
<style> 
#product {
float:left;
behavior: url(border-radius.htc);
margin:5px 5px;
border-radius: 15px 15px 15px 15px;
-moz-border-radius:15px 15px 15px 15px;
-webkit-border-radius:15px 15px 15px 15px;
border:1px solid #999;
background: white;
width:162px;
height:190px;
/*font-size: 12px;*/
}

#product .title{
  color:#9aa0a2;
  /*font-weight:bold;*/
  text-align:left;
  margin:3px;
}
#product img{
  margin:5px 15%;
}
#product .price{
  text-align:center;
  margin-top:10px;
  color:#02aff0; 
  font-weight:bold; 
  font-size:21px;
}
#wrap {width: 704px; margin: 0 auto;}
</style>


<div id="wrap">
<a href="item.php?item_id=149876">
<div id="product">
  <div class="title">Canon EOS 60D<br>DSLR Body</div>
  <img src="homepageselections/canon-eos-60d.gif" alt="canon-eos-60d">
  <div class="price">&pound;719 inc VAT</div>
</div>
</a>
<a href="search.php?txt=55-250&x=35&y=14">
<div id="product">
  <div class="title">Canon 55-250mm IS Lens<br>&nbsp;</div>
  <img src="homepageselections/canon-is-lens.gif" alt="canon-is-lens" />
  <div class="price">&pound;139 inc VAT</div>
</div>
</a>
<a href="item.php?item_id=151546">
<div id="product">
  <div class="title">Canon EOS T2i/ EOS 550D<br>with 18-55mm IS Lens</div>
  <img src="homepageselections/canon-550d.gif" alt="canon-550d" />
  <div class="price">&pound;549 inc VAT</div>
</div>
</a>
<a href="item.php?item_id=151588">
<div id="product">
  <div class="title">Nikon D7000 Body<br>&nbsp;</div>
  <img src="homepageselections/nikon-d7000.gif" alt="nikon-d7000" />
  <div class="price">&pound;859 inc VAT</div>
</div>
</a>
<a href="item.php?item_id=151938">
<div id="product">
  <div class="title">Olympus-XZ-1 Black<br>&nbsp;</div>
  <img src="homepageselections/olympus-xz-1.gif" alt="olympus-xz-1" />
  <div class="price">&pound;349 inc VAT</div>
</div>
</a>
<a href="search.php?txt=ipad&x=0&y=0">
<div id="product">
  <div class="title">Apple Ipads WiFi & 3G<br>Models Available</div>
  <img src="homepageselections/apple-ipad.gif" alt="apple-ipad" />
  <div class="price">View all</div>
</div>
</a>
<a href="search.php?txt=panasonic&x=0&y=0">
<div id="product">
  <div class="title">Get the best deals on<br>Panasonic Point & Shoot</div>
  <img src="homepageselections/panasonic-point-and-shoot.gif" alt="panasonic-point-and-shoot" />
  <div class="price">View all</div>
</div>
</a>
<a href="search.php?txt=nikon+slr+lens&x=0&y=0">
<div id="product">
  <div class="title">Best Selection of Nikon<br>SLR Lenses</div>
  <img src="homepageselections/nikon-slr-lenses.gif" alt="nikon-slr-lenses" />
  <div class="price">&pound;859 inc VAT</div>
</div>
</a>
</div>


    
    <div style="line-height: 10px">&nbsp;</div>


    
  </div>  
  

  <!-- END Right Column -->
</div><script language = "Javascript">
    function echeck(str) {
        var at="@"; var dot="."; var lat=str.indexOf(at); var lstr=str.length; var ldot=str.indexOf(dot); 
        if (str.indexOf(at)==-1){ alert("Please reenter your email address"); return false; }
        if (str.indexOf(at)==-1 || str.indexOf(at)==0 || str.indexOf(at)==lstr){ alert("Please reenter your email address"); return false; }
        if (str.indexOf(dot)==-1 || str.indexOf(dot)==0 || str.indexOf(dot)==lstr){ alert("Please reenter your email address"); return false; }
        if (str.indexOf(at,(lat+1))!=-1){ alert("Please reenter your email address"); return false; }
        if (str.substring(lat-1,lat)==dot || str.substring(lat+1,lat+2)==dot){ alert("Please reenter your email address"); return false; }
        if (str.indexOf(dot,(lat+2))==-1){ alert("Please reenter your email address"); return false; }
        if (str.indexOf(" ")!=-1){ alert("Please reenter your email address"); return false; }
        return true;
    }

    function ValidateForm(){
        var emailID=document.newslettersignup.Email
        if ((emailID.value==null)||(emailID.value=="")){ alert("Please Enter your Email ID"); emailID.focus(); return false; }
        if (echeck(emailID.value)==false){ emailID.value=""; emailID.focus(); return false; }
        return true;
    }
    </script> 
<style type="text/css">








#footer{

  color:#9aa0a2;
  padding:20px;
  padding-bottom:0px;
  padding-top:15px;
  font-family:Arial, Helvetica, sans-serif;
  font-size:11px;
  margin:0 auto;
  width:894px;
  height:190px;
  background:url(siteimg/footet-bg.gif) no-repeat; 
  

}

#footer img{
  border:0px;
}

#footer div{
  float:left;
  width:180px;
}

#footer div b{
  line-height:20px;
}

#footer div a{  line-height:17px;
  display:block;
  color:#02aff0;
}

#footer div a:hover{
  color:#9aa0a2;
}

.emailInput{
  color:#666;
  width:160px;
  padding-left:5px;
  padding-top:3px;
  height:19px;
  line-height:14px;
  font-size:11px;
  border:1px solid #9aa0a2;
  border-right:0px;
  float:left;
}







</style>
<div class="container" style="padding-top:10px;">
  <div id="footer">

    <div>
        <b>Customer Services</b><br />
           <a href="/myaccount.php">Order Tracking</a>
          <a href="termsandconditions.php#processinganddelivery">Delivery</a>
          <a href="termsandconditions.php#returnpolicy">Returns &amp; Cancellations</a>
      </div>

    <div>
          <b></b><br />
          <a href="#">How to place an order</a>
          <a href="/cart">Payment</a>
          <a href="termsandconditions.php">Terms and Conditions </a>   
      </div>

    <div style="width:150px;">
          <b>Company</b><br />
          <a href="/aboutus.php">About us</a>
          <a href="/privacypolicy.php">Security and Privacy</a>
          <a href="/contact.php">Contact Us</a>
      </div>
   
    <div style="width:150px;">
          <!--<b>Safe Shopping</b><br />-->
          <!--<a href="#"><img src="siteimg/trustedwave.gif" style="margin-bottom:5px;" /></a>
          <a href="#"><img src="siteimg/verisign.gif" /></a>-->
          

      </div>

    <div style="width:210px;">
           <img src="siteimg/newsletter-signup.gif" /><br />
          Sign up to receive our latest offers<br /><br />
          <form action="newslettersignup.php" name="newslettersignup" onSubmit="return ValidateForm()"><input type="text" style="height:20px;" name="Email" value="E-mail Address" onfocus="this.value='';" class="emailInput" /><input type="image" src="siteimg/newsletter-go.gif" style="margin-top:-1px;float:left;"/></form>
      </div>
      <br style="clear:both" />
      <div style="width:440px;">
      <span style="line-height:20px;">&copy 2011   |  All rights reserved</span><br />
      Prices, specifications, and images are subject to change without notice. 
  Not responsible for typographical or illustrative errors. Manufacturer rebates, 
  terms, conditions and expiration dates are subject to manufacturers printed forms.
      </div>
      <div style="width:450px;padding-top:10px;text-align:center;">
        <img src="siteimg/payment-methods.gif" />
        <!--<img src="siteimg/payment-methods.gif" width="440" />-->
      </div>
      
  </div>
</div>
</div>
<div class="container" style="background:none;"><img src="../siteImg/c-bot.gif" /></div></body></html>
  

  
  
<script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-21099058-1']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

</script>

Open in new window

0
 
LVL 16

Expert Comment

by:SSupreme
ID: 36898219
It looks fine in IE8, but in order to solve issue below I think you need to validate your markup.
Here: http://validator.w3.org/
0
 

Author Comment

by:rgb192
ID: 36898265
0
 
LVL 15

Expert Comment

by:Eyal
ID: 36898411
in the border-radios.htc you have in line 55 the following code
this.style.borderColor = 'transparent';
this is probably the reason for borders disappear
0
 

Author Comment

by:rgb192
ID: 36899125
i change
this.style.borderColor = 'red';
no difference
using

http://www.my-debugbar.com/wiki/IETester/HomePage

That emulates IE 5.5 to IE 10 in one program. Works really well.
0
 
LVL 15

Expert Comment

by:Eyal
ID: 36899133
I see red borders now :)
0
 

Author Comment

by:rgb192
ID: 36899147
maybe another style rule is setting border to transparent
0
Highfive Gives IT Their Time Back

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

 

Author Comment

by:rgb192
ID: 36899172
ie8: square grey borders
ie7: square red borders


how to make border curves rounded
0
 
LVL 15

Expert Comment

by:Eyal
ID: 36899194
in ie 5-8 you can't display rounded borders if you are not using images
0
 

Author Comment

by:rgb192
ID: 36899198
http://imagesretrospective.com/works.html

this works for ie8,ie7
the red square borders are there because

i change border-radius.htc
this.style.borderColor = 'red';
0
 

Author Comment

by:rgb192
ID: 36899205

<style> 
#product {
float:left;
behavior: url(border-radius.htc);
margin:5px 5px;
border-radius: 15px 15px 15px 15px;
-moz-border-radius:15px 15px 15px 15px;
-webkit-border-radius:15px 15px 15px 15px;
border:1px solid #999;
background: white;
width:162px;
height:190px;
/*font-size: 12px;*/
}

#product .title{
  color:#9aa0a2;
  /*font-weight:bold;*/
  text-align:left;
  margin:3px;
}
#product img{
  margin:5px 15%;
}
#product .price{
  text-align:center;
  margin-top:10px;
  color:#02aff0; 
  font-weight:bold; 
  font-size:21px;
}
#wrap {width: 704px; margin: 0 auto;}
</style>


<div id="wrap">
<a href="item.php?item_id=149876">
<div id="product">
  <div class="title">Canon EOS 60D<br>DSLR Body</div>
  <img src="homepageselections/canon-eos-60d.gif" alt="canon-eos-60d">
  <div class="price">&pound;719 inc VAT</div>
</div>
</a>
<a href="search.php?txt=55-250&x=35&y=14">
<div id="product">
  <div class="title">Canon 55-250mm IS Lens<br>&nbsp;</div>
  <img src="homepageselections/canon-is-lens.gif" alt="canon-is-lens" />
  <div class="price">&pound;139 inc VAT</div>
</div>
</a>
<a href="item.php?item_id=151546">
<div id="product">
  <div class="title">Canon EOS T2i/ EOS 550D<br>with 18-55mm IS Lens</div>
  <img src="homepageselections/canon-550d.gif" alt="canon-550d" />
  <div class="price">&pound;549 inc VAT</div>
</div>
</a>
<a href="item.php?item_id=151588">
<div id="product">
  <div class="title">Nikon D7000 Body<br>&nbsp;</div>
  <img src="homepageselections/nikon-d7000.gif" alt="nikon-d7000" />
  <div class="price">&pound;859 inc VAT</div>
</div>
</a>
<a href="item.php?item_id=151938">
<div id="product">
  <div class="title">Olympus-XZ-1 Black<br>&nbsp;</div>
  <img src="homepageselections/olympus-xz-1.gif" alt="olympus-xz-1" />
  <div class="price">&pound;349 inc VAT</div>
</div>
</a>
<a href="search.php?txt=ipad&x=0&y=0">
<div id="product">
  <div class="title">Apple Ipads WiFi & 3G<br>Models Available</div>
  <img src="homepageselections/apple-ipad.gif" alt="apple-ipad" />
  <div class="price">View all</div>
</div>
</a>
<a href="search.php?txt=panasonic&x=0&y=0">
<div id="product">
  <div class="title">Get the best deals on<br>Panasonic Point & Shoot</div>
  <img src="homepageselections/panasonic-point-and-shoot.gif" alt="panasonic-point-and-shoot" />
  <div class="price">View all</div>
</div>
</a>
<a href="search.php?txt=nikon+slr+lens&x=0&y=0">
<div id="product">
  <div class="title">Best Selection of Nikon<br>SLR Lenses</div>
  <img src="homepageselections/nikon-slr-lenses.gif" alt="nikon-slr-lenses" />
  <div class="price">&pound;859 inc VAT</div>
</div>
</a>
</div>

Open in new window

0
 
LVL 16

Expert Comment

by:SSupreme
ID: 36899208
I got to say that you DO NOT need to change border-radius.htc, it should work as it is.
0
 
LVL 15

Expert Comment

by:Eyal
ID: 36899211
0
 

Author Comment

by:rgb192
ID: 36899215
>>I got to say that you DO NOT need to change border-radius.htc, it should work as it is.


I think there is a style rule preventing this from working, but I can not find it
http://imagesretrospective.com/test.html
0
 
LVL 16

Accepted Solution

by:
SSupreme earned 500 total points
ID: 36899281
Ok, finally I found borders, but I want to say that existed borders should be transparent at IE8, IE7 and IE6, make they transparent instead of red.
The problem with new borders is that they have z-index:-1; , so they under everything, in first layer. you can make them seen if you change background color to transparent in the following classes: container and PYXITEMAREA in screen.css
Try it and check whether it is fine with you to have no color on these divs.
0
 

Author Comment

by:rgb192
ID: 36899873
works with ie7,8
but now borders of ie9 are dark and thick



commented out background in these css classes

.PYXITEMAREA {
  width:947px;
  margin:0 auto;
  /*background: #ffffff url(../siteimg/item-bg.gif) no-repeat bottom;*/
      padding-bottom:10px;
  color:#000000;
}

.container{width:951px;margin: 0 auto; /*background:#ffffff url(../siteimg/c-bg.gif) repeat-y;*/}







attached is screen.css
.tab-body-title {
    display: block;
    font-size: 18px;
    font-weight: bold;
    padding-bottom: 10px;
}
.clearfloat {
    clear: both;
    font-size: 1px;
    height: 0;
    line-height: 0;
}

.package-display-wrap {
    border-bottom: 1px dashed #CBDADA;
    float: left;
    padding: 10px 10px 10px 0;
    width: 890px;
}
.package-display-img {
    float: left;
}
.package-display-img img {
    width: 100px;
}
.package-display-title {
    float: left;
    font-size: 12px;
    padding-left: 65px;
    width: 440px;
}
.package-display-price {
    float: right;
    text-align: right;
}
.package-display-link {
    margin-top: 10px;
}
.package-display-link a {
    text-decoration: underline;
}
.package-display-link a:hover {
    text-decoration: none;
}
.package-lineitem-price {
    background-color: #F2F4F4;
    border: 1px solid #CBDADA;
    float: right;
    line-height: 17px;
    margin-left: 20px;
    padding: 10px;
    text-align: right;
    width: 240px;
}
ul.package-includes-list {
    margin-bottom: 0;
    margin-left: 0;
    margin-top: 0;
    padding-bottom: 15px;
    padding-left: 20px;
    padding-top: 5px;
}
ul.package-includes-list li {
    background: url("/web/assets/images/home_check.gif") no-repeat scroll 0 2px transparent;
    font-size: 11px;
    list-style-type: none;
    margin-bottom: 7px;
    margin-left: -10px;
    margin-top: 0;
    padding-left: 15px;
}
.h-divider-dashed {
    border-bottom: 1px dashed #CBDADA;
    height: 1px;
    width: 100%;
}




/*------------------------*/

.bgcontainer {position:relative;width:500px;height:200px;background:lightblue;}
a.spot {display:none;width:100px;height:100px;position:absolute;left:50px;top:50px;border:solid 1px red;text-decoration:none;}





.span-6 {
	margin-right:3px !IMPORTANT;
}

.span6high
        {
padding:0px 2500px 25px 25px;
  width:00px;
  float:left;      
        }
.PYXHEADER {
	width:951px;
	background:url('../siteimg/headerbg.gif') no-repeat;
	height:99px;
}

.PYXNAVIGATIONFIRST {
	width:190px;
	padding:0 20px 0 0 !important;
}

.PYXNAVIGATION {
	padding-left:422px;
  height:30px;
  /*font-family:Verdana;*/
  font-size:11px;
  font-weight:bold;
  
  /*this is on top of page text-decoration:underline;*/
  /*border:1px solid #000000;*/
}

.PYXNAVIGATION a {
	font-size:11px;
  font-family:Arial, Helvetica, sans-serif;
  font-weight:bold;
  padding-top:5px;
  line-height: 25px;
  padding-bottom:5px;
  padding-left:7px;
  padding-right:12px;
  color:#577782;
	text-decoration:none;
  background: url(../siteimg/navbg.gif) no-repeat right;
} 

.PYXNAVIGATION a:hover {
  color:#000000;
} 

.PYXSEARCH {
  width:947px;
  margin-left:2px;
  margin-right:2px;
  background:url('../siteimg/navbg.gif') repeat-x;
  height:32px;
  border-bottom:1px solid #e8eff2;
	
}

.searchForm{
  float:right;
  margin-right:10px;
  margin-top:3px;
}

.searchForm input{
  float:left;
}

.emailTxtBox{
  height:21px;
  margin-top:1px;
  font-size: 11px;line-height:18px;
  padding-left:5px;
  padding-bottom:2px;
  font-family:verdana, Helvetica, sans-serif;
  width:200px;
  border:1px solid #4c95d3;

}
.searchdrop {
	border-top:1px solid #ffffff;
	line-height:30px;
	width:795px;
	background:url('../siteimg/searchdrop.gif') top right repeat-x;
}

.PYXSECTIONS {
	background:url('../siteimg/navbg.gif') top right repeat-x;
	height:36px;
  margin:2px;
  margin-top:0px;
  margin-bottom:0px;
}

.PYXSEARCH table td {
	padding:0;
}

.PYXBREADCRUMBS {
	height:31px;border-bottom:1px solid #e8eff2;background-color:#ffffff;
	font:11px "Trebuchet MS","Lucida Sans Unicode","Lucida Grande","Lucida Sans",Helvetica,Arial,sans-serif;
	color:#aeaeae;
  margin:2px;padding-top:2px;
  margin-top:0px;
  margin-bottom:0px;
  padding-left:20px;

}


.PYXBREADCRUMBS a {
padding-left:5px;
line-height:31px;
padding-top:10px;
padding-bottom:7px;
  padding-right:20px;
  background: url(../siteimg/breadcrump-bg.gif) no-repeat right bottom;
	color:#aeaeae;
	text-decoration:none;
}

.PYXBREADCRUMBS a:hover{
  color:#aeaeae;
}





/*I needed to repeat*/
.PYXBREADCRUMBS2 {
  height:31px;border-bottom:1px solid #e8eff2;background-color:#ffffff;
  font:11px "Trebuchet MS","Lucida Sans Unicode","Lucida Grande","Lucida Sans",Helvetica,Arial,sans-serif;
  color:#aeaeae;
  margin-left:2px;
  margin-bottom:2px;
  margin-right:0px;
  margin-top:0px;
  margin-bottom:0px;
  padding-top:2px;
  padding-left:20px;
  /*padding-right:-60px;*/
  
  

}


.PYXBREADCRUMBS2 a {
padding-left:5px;
line-height:31px;
padding-top:10px;
padding-bottom:7px;
  padding-right:20px;
  /*background: url(../siteimg/breadcrump-bg2.gif) no-repeat right bottom;*/
  color:#aeaeae;
  text-decoration:none;
}

.PYXBREADCRUMBS2 a:hover{
  color:#aeaeae;
}
/*end repeat*/






.PYXHSBADGE {
	padding-top:5px;
}


.PYXITEMAREA {
  width:947px;
  margin:0 auto;
  /*background: #ffffff url(../siteimg/item-bg.gif) no-repeat bottom;*/
	padding-bottom:10px;
  color:#000000;
}

.PYXITEMAREApayment {
  width:947px;
  margin:0 auto;
  background: #ffffff url(../siteimg/item-bg.gif) no-repeat bottom;

  color:#000000;
}






.PYXITEMLEFT {
	padding-top:10px;
	padding-left:20px;
	font-size:11px;
}

.PYXITEMLEFT h4 {
	font-family:Verdana;
	font-size:11px;
	font-weight:bold;
	margin:0 0 4px 0;
}

.PYXITEMLEFT hr {
	margin:0;
}

.infotable table tr td {
	vertical-align:top;
	text-align:right;
}

.infotable ul {
	margin:0 0 0 0;
}

.infotable li {
  list-style:none;
  padding-left:7px;
  font-size:10;
  background:url('../siteimg/blue_arrow.gif') no-repeat;
  background-position:0px 6px;
}


.infotable b {
	font-size:12px;
}

.PYXMISCTASKS {
	font:10px "Trebuchet MS","Lucida Sans Unicode","Lucida Grande","Lucida Sans",Helvetica,Arial,sans-serif;
	padding-top:8px;
	padding-left:300px;
	width:200px;
	color:#000000;
	text-align:left;
	line-height:10px;
}

.PYXISPRINTPAGE, .PYXISEMAILPAGE, .PYXISEMAILUS, .PYXISSEEKITS {
	float:left;
}

.PYXISPRINTPAGE {
	
}

.PYXISEMAILPAGE {
	padding-left:45px;
}

.PYXISEMAILUS {
	padding-top:5px;
	padding-left:48px;
}

.PYXISSEEKITS {
	padding-left:48px;	
}

.PYXISPRODUCTIMAGES {
	padding-top:14px;
/*	padding-left:20px; */
	width:288px;
	text-align:center;
	float:left;
}

.PYXISPRODUCTIMAGES img {
	max-height:250px;
}

.PYXISPRODUCTTHUMBNAILS {
  width:90px;
	display:inline-block;
}

.PYXISPRODUCTTHUMBNAILS img {
	max-width:50px;
	max-height:80px;
}

.PYXISPRODUCTTHUMBNAILS div {
	padding:5px;
	margin:10px 10px;
	border:1px solid #edf3f3;
	width:53px;
}

.PYXISSHORTINFO {
	padding-top:10px;
}

.PYXISSHORTINFO h1 {
	padding-top:5px;
	color:#363636;
	font-weight:bold;
	font-size:12px;

}

.PYXISSHORTINFO p {
	padding-top:28px;
	color:#000000;
	font:10px Arial, sans-serif;
}

.PYXITEMDETAILS {
  width:947px;
  padding-top:10px;
  margin:0 auto;
	text-align:left;
	background-color:#ffffff;
}

.PYXITEMDETAILSSIDEBAR {
	float:left;
	width:170px;
}

.PYXITEMDETAILSMAINAREA {
	/*this is the real item tabs, where i have an underline, i can change only size*/
  color:red;
  font-size:12px;
	font-family:Verdana, "Lucida Sans Unicode","Lucida Grande","Lucida Sans",Helvetica,Arial,sans-serif,"Bitstream Vera Sans";
	float:left;
	width:776px;
  margin-left:2px;
	background:#FFFFFF;
}

.PYXITEMDETAILSMAINAREA dl, .PYXITEMDETAILSMAINAREA dd {
	font-size:12px;
}

.PYXITEMDETAILSMAINAREA {
color:aqua;
} 

.PYXTABS {
	background:url('../siteimg/tabs-bg.gif') no-repeat;
	line-height:0;
  width:934px;
  color:#d5d5d5;
  margin-left:7px;
	text-align:left;
  padding-top:3px;
  height:29px;
}
.PYXTABS a{
  /*text-decoration:none;*/
}
/*
.PYXTABS a.lastChild img {
	border-right:1px solid #ffffff;
}
*/
.PYXaccHead {
	background:url("../siteimg/accHeadBG.jpg") repeat-x;
	padding:5px 0 0 22px;
	height:34px;
	color:#FFFFFF;
}
#PYXaccSel {
	color:#FF0000;
}

.PYXGENERALBG {
	margin:0 auto;
	width:907px;
	color:#000000;
	background-color:#FFFFFF;

 	padding-bottom:10px;
}

.PYXCARTCONTAINER {
  width:907px;
  margin:0 auto;
  background: #ffffff url(../siteimg/item-bg.gif) no-repeat bottom;
  padding:20px;
  padding-top:10px;
 }

.PYXCARTCONTAINER table {
	width:906px;
	border-collapse:collapse;
}

.PYXCARTCONTAINER table tr:first-child td {
	padding:0;
	border:0;
	line-height:0;
}

.PYXCARTCONTAINER table tr td:first-child {
	border-left:solid 1px #f1f1f1;
	border-right:solid 1px #f1f1f1;
}

.PYXCARTCONTAINER table tr td {
	border:solid 1px #f1f1f1;

/*	border-right:solid 1px #f1f1f1;
	border-bottom:solid 1px #f1f1f1;*/
}

/*.PYXCARTCONTAINER table tr td:first-child img { max-height:200px; }*/

.PYXCARTLINE td img { max-height:60px; }
.PYXCARTLINE td { padding:10px; margin:0px;}
.PYXCARTLINE td { vertical-align:middle; font-weight:bold; font-family:Verdana; font-size:10px; }

.PYXCARTLINE td a:focus, .PYXCARTLINE td a:hover, .PYXCARTLINE td a:link , .PYXCARTLINE td a:visited {
	color:#02aff0;
}

.PYXCARTBOTTOM {
	background:url('../siteimg/CARTbg.jpg') top left repeat-x;
}

/* Category Page*/
.PYXCATVIEWHEADER {
	background:url('/siteimg/greyrect.jpg') no-repeat;
	width:930px;
	height:23px;
	color:#ffffff;
	padding-top:10px;
	padding-left:15px;
	font-family:Arial;
	font-size:14px;
	border:1px solid #ffffff;
}

.PYXCATVIEWITEM {
	border-bottom:8px solid #e3e3e3;
	padding-bottom:10px;
	font-family:Arial;
	font-size:16px;
	color:#000000;
	line-height:20px;
}

.PYXCATVIEWITEM img {
	max-width:70px;
	max-height:70px;
}

.PYXCATVIEWITEM tr td {
	padding:0;
	vertical-align:top;
	padding-left:30px;
	padding-top:20px;
	padding-bottom:20px;
}


.PYXCATVIEWITEM td a:focus, .PYXCATVIEWITEM td a:hover, .PYXCATVIEWITEM td a:link , .PYXCATVIEWITEM td a:visited {
	color:#0eb4f2;
}

.PYXCATSPECIALVIEWITEM {
	border-bottom:2px solid #e3e3e3;
	font-family:Arial;
	font-size:16px;
	color:#000000;
/*	line-height:16px;*/
	border-spacing:0;
	padding-bottom:0;
}

.PYXCATSPECIALVIEWITEM img {
	max-width:70px;
	max-height:70px;
}

.PYXCATSPECIALVIEWITEM tr td {
	padding:0;
	vertical-align:top;
	padding-left:20px;
	padding-top:10px;
	padding-bottom:5px;
}


.PYXCATSPECIALVIEWITEM td a:focus, .PYXCATSPECIALVIEWITEM td a:hover, .PYXCATSPECIALVIEWITEM td a:link , .PYXCATSPECIALVIEWITEM td a:visited {
	color:#0eb4f2;
	font-size:12px;
}

.PYXCATCHIT {
	font-size:10px;
	font-family:Verdana;
	/*font-weight:bold;*/
}


.PYXCATSORTBY {
	background-color:#e3e3e3;
	width:900px;
	height:35px;
	padding:6px 30px 4px 15px;
}

.PYXCATSORTBY table tr td {
	padding:0;
}

.PYXCATPRICE {
	font-size:16px;
	color:#199600;
	font-weight:bold;
}

.PYXCATAVAILABILITY {
	color:#0eb4f2;
	font-weight:bold;
}

.PYXSPECCAT {
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
	font-size:12px;
	height:23px;
	padding-top:6px;
	padding-left:10px;
	padding-right:10px;
	width:166px;
	font-weight:bold;
	color:#626262;
	background:url(../siteimg/filter_attr.gif) repeat-x;

}

.PYXSPECCATDATA {
	font-family:Verdana;
	font-weight:bold;
	font-size:10px;
	line-height:8px;
	padding-top:6px;
	padding-bottom:6px;
	padding-left:10px;
	padding-right:10px;
	width:166px;
	color:#646464;
	border-bottom:3px solid #ffffff;
	overflow:auto;
/*	max-height:150px; */
}
	

#accessoriescon img:first-child {
	max-height:60px;
	padding-left:50px;
}
#accessoriescon {
	color:#000000;
}

#descriptioncon, #featurescon, #specificationscon, #itemincludescon {
	padding:40px;
	background:#FFFFFF;
	color:#000000;
	height:100%;
}

#packagescon {
	padding:0px;
	background:#FFFFFF;
	color:#000000;
	height:100%;
}



/* search style */
.PYXSEARCHVIEWHEADER {
	background:url('/siteimg/greyrect.jpg') no-repeat;
	width:915px;
	height:23px;
	color:#ffffff;
	padding-top:10px;
	padding-left:30px;
	font-family:Arial;
	font-size:14px;
	border:1px solid #ffffff;
}

.PYXSEARCHVIEWITEM {
	border-top:1px solid #dbdbdb;
	border-bottom:2px solid #e3e3e3;
	padding-bottom:10px;
	font-family:Arial;
	font-size:14px;
	color:#000000;
	line-height:20px;
	width:795px;
}

.PYXSEARCHVIEWITEM img {
	max-width:70px;
	max-height:70px;
}

.PYXSEARCHVIEWITEM tr td {
	padding:0;
	vertical-align:top;
	padding-left:20px;
	padding-top:20px;
	padding-bottom:0px;
}

/*
.PYXSEARCHVIEWITEM td a:focus, .PYXSEARCHVIEWITEM td a:hover, .PYXSEARCHVIEWITEM td a:link , .PYXSEARCHVIEWITEM td a:visited {
	color:#0eb4f2;
	font-size:12px;
}
*/


.titletxt a:link, .titletxt a:visited {
	font-family:Verdana;
	font-weight:bold;
	font-size:11px;
	color:#000000 !IMPORTANT;
	text-decoration:none;
}

.titletxt a:focus, .titletxt a:hover {
	text-decoration:underline;
}

.moreinfo a:link, .moreinfo a:visited {
	font:Arial;
	font-size:12px;
	font-weight:bold;
	color:#0eb4f2;
}

.moreinfo a:focus, .moreinfo a:hover {
	color:#000099;
	text-decoration:underline;
}

/* MISC LAYOUT STYLES */
.sectionAnchor a:link, .sectionAnchor a:hover, .sectionAnchor a {
	color:#ae150d;
	text-decoration:none;
	font-size:1.4em;
}

.specialHeader {
	color:#ae150d;;
}

.purchasesummary {
	margin:0 auto;
	color:#333333;
	width:370px;
	padding:15px;
	padding-left:10px;
	padding-top:40px;
	padding-bottom:50px;
	font-size:12px;
	background:url('../siteimg/summaryrect.jpg') no-repeat;
}

.purchasesummary ul {
	margin:0;
	padding-left:15px;
	padding-bottom:0;
	font-size:10px;
}

.purchasesummary ul {
	margin:0;
	padding-left:15px;
	padding-bottom:0;
	font-size:10px;
}

.purchasesummary ul li {
	font-family:Arial,Helvetica,sans-serif;
	font-size:10px;
}

.purchasesummary b {
	font-size:16px;
	font-family:Verdana,Arial,Helvetica,sans-serif;
}

.purchasesummary table, .purchasesummary td, .purchasesummary th {
	vertical-align:top;	
	padding:5px 10px 0 5px;
}

.confidencebadges {
	border-top:1px solid #edf3f3;
	display: table-cell;
	vertical-align: center;
}

.confidencebadges div {
	float:left;
	width:87px;
	text-align:center;
	border-left:1px solid #edf3f3;


}
.confidencebadges div:first-child {
	border:0;
}

.miscinfo {
	padding-top:10px;
	color:#565656;
}

.miscinfo th {
	font-family:Arial;
	font-size:10px;
	font-weight:bold;
	background:none;
	color:#ab140d;
}

.miscinfo td {
	font-family:Verdana;
	font-size:11px;
	font-weight:normal;
	background:none;
	color:#565656;
	padding:0;
	vertical-align:bottom;
}

.miscinfo tr td div {
	color:#565656;
}

.miscinfo a:focus, .miscinfo a:hover, .miscinfo a:link, .miscinfo a:visited {
	color:#565656;
}

.PACKAGEGALLERY {

}

.PACKAGEGALLERY img {
	max-height:550px;
	max-width:570px;
	border:1px solid #edf3f3;
	padding:2px;
}

table.pyxpackpageinfo {
	margin:15px 0 0 0;
	float:left;
}

table.pyxpackpageinfo tr td {
	vertical-align:top;
}

table.pyxpackpageinfo tr td ul li, table.pyxpackpageinfo tr td b {
	text-align:left;
	list-style-type:disc;
}

table.pyxpackpageinfo tr td ul {
	list-style-position:outside;
}

.pyxpackpageinfo tr td h4 {
	font-size:12px;
	font-weight:bold;
}

.pyxpackpageinfo tr td h5 {
	font-size:11px;
	font-family:Arial;
}

/* Package Summary*/
.packagesummary {
	margin:0 auto;
	color:#333333;
	width:370px;
	padding:15px;
	padding-left:10px;
	padding-top:40px;
	padding-bottom:50px;
	font-size:12px;

}

.packagesummary ul {
	margin:0;
	padding-left:15px;
	padding-bottom:0;
	font-size:10px;
	font-family:Verdana,Arial,Helvetica,sans-serif;
	}


.packagesummary b {
	font-size:16px;
	font-family:Verdana,Arial,Helvetica,sans-serif;
}

.packagesummary table, .packagesummary td, .packagesummary th {
	vertical-align:top;	
	padding:5px 10px 0 5px;
}



.pyxisprice {
	font-size:24px;
	color:#0eb4f2;
}

.pyxiscartprice {
	color:#0eb4f2;
	font-family:Verdana;
	font-size:14px;
	font-weight:bold;
}
.pyxiscartpriceblack{
text-align:right;
  color:#000000;
  font-family:Verdana;
  font-size:14px;
  font-weight:bold;

}




.cartqty {
	background:#FFFFFF none repeat scroll 0%;
	border:1px solid #666666;
	color:#000000;
	font-family:arial;
	font-size:11px;
	padding:3px;
	width:48px;
  font-weight: bold;
}

.shippingcoststable table tr td {
	font-family:Arial;
	letter-spacing: -1px;
    color: #909090;
    font-size: 20px;
    font-weight: bold;
	padding-left:90px;
}

.shippingcoststable table tr th {
	font-family:Arial;
	letter-spacing: -1px;
    color: #909090;
    font-size: 20px;
    font-weight: bold;
	text-align:right;
	background:#ffffff;
}



/* Shopping Cart Styles */
.PYXCARTSTEP1 {
	margin:0 auto;
	width:906px;
	color:#434343;
	font-family:Verdana;
	font-size:10px;
	font-weight:bold;
	

	padding:0px 20px 140px 20px;
    background: #ffffff url(../siteimg/item-bg.gif) no-repeat bottom;
	
	
}

.PYXCARTSTEP1 input.text {
	background:#FFFFFF none repeat scroll 0% 50%;
	border:1px solid #a5acb2;
	color:#555555;
	font-family:arial;
	font-size:11px;
	padding:3px;
	width:171px;
}


.PYXCARTSTEP1 table {
	border-collapse: collapse;
	border:solid 1px #f1f1f1;
}

.PYXCARTSTEP1 table tr td {
	text-align:right;
	font-family:Verdana;
	font-size:12px;
/*	font-weight:bold;*/
	border:solid 1px #f1f1f1;
}

.PYXCARTSTEP1 td.menu{
text-align:left; font-weight:bold; font-size:18px; padding:0px 0px 0px 20px;
}

.PYXCARTSTEP1 p.left{
text-align:left; font-size:13px; padding:0px 0px 0px 20px;
}

.PYXCARTSTEP1 table tr td:first-child {
	padding-right:90px;
}

#signupmessage {
	font-weight:normal;
}

.PYXCARTSTEP2 {
	margin:0 auto;
	width:906px;
}

.PYXCARTSTEP2 table tr td {
	padding:4px 10px 4px 5px;
	border:solid 1px #f1f1f1;
}

.PYXCARTSTEP2 table tr td:first {
	padding:4px 10px 4px 5px !important;
	border:solid 1px #f1f1f1 !important;
}

.PYXCARTSTEP3 {
	margin:0 auto;
	width:906px;
}

.PYXCARTSTEP3 table {
	border:solid 1px #cecece;
}

.PYXCARTSTEP3 table tr td {
	padding:15px;
	border-bottom:solid 1px #cecece;
	border-collapse: separate;
}

.PYXCARTSTEP3txt {
	font-family:Verdana;
	font-size:10px;
	font-weight:bold;
	color:#02aff0;
}

.PYXCARTSTEP3txtbigger {
	font-family:Verdana;
	font-size:15px;
	font-weight:bold;
	color:#02aff0;
}

.thankyoutxt {
	font-size:15px;
	font-weight:bold;
	color:#02aff0;
}

.errorbox{
	 background-color:#fde9e6;
	 border: 1px solid #ff0000;
	 padding:10px;
	 margin-top:10px;
}


.PYXRETURNINGCUSTOMERTABLE {
	
}

.PYXCATEGORYPAGE {
	text-align:left;
  
  
   width:907px;
  margin:0 auto;
    background: #ffffff url(../siteimg/item-bg.gif) no-repeat bottom;
  
  
  
  /*padding-bottom:10px;*/
    padding:20px;
  padding-top:10px;
  
}

.PYXCATEGORYPAGE a:focus, .PYXCATEGORYPAGE a:hover, .PYXCATEGORYPAGE a:link, .PYXCATEGORYPAGE a:visited {
	color:#7F7F7F;
	text-decoration:none;
	font-size:12px;
}

.PYXCATEGORYPAGE table {
	margin-left:80px;
	margin-bottom:20px;
/*	float:left;
	display:inline; */
	width:260px;
}



.PYXCATEGORYPAGE tr td {
	padding:2px;
}

/*	Contact Us Page	*/
.contactus {
	width:100%;
	font-family:arial, sans-serif;
	font-size:12px;
}

.contactus textarea {
	width:200px;
	height:100px;
	padding:5px;
}

.contactus input {
	width:200px;
	border:1px solid #e8e8e8;
}

.contactus select {
	width:200px;
	border:1px solid #e8e8e8;
}

/* policy page */
.policy h1 {
	font-size:12px;
	font-weight:bold;
	font-family:Verdana;
}

.policy p {
	font-size:12px;
	font-family:Arial, sans-serif;
}

/* footer styles */



#footer{

  color:#9aa0a2;
  padding:20px;
  padding-bottom:0px;
  padding-top:15px;
  font-family:Arial, Helvetica, sans-serif;
  font-size:11px;
  margin:0 auto;
  width:894px;
  height:190px;
  background:url(siteimg/footet-bg.gif) no-repeat; 
  

}

#footer img{
  border:0px;
}

#footer div{
  float:left;
  width:180px;
}

#footer div b{
  line-height:20px;
}

#footer div a{  line-height:17px;
  display:block;
  color:#02aff0;
}

#footer div a:hover{
  color:#9aa0a2;
}

.emailInput{
  color:#666;
  width:160px;
  padding-left:5px;
  padding-top:3px;
  height:19px;
  line-height:14px;
  font-size:11px;
  border:1px solid #9aa0a2;
  border-right:0px;
  float:left;
}








.footerlinks {
	margin:0 auto;text-align:center;color:#7a7a7a;
}

.footerlinks a:focus, .footerlinks a:hover, .footerlinks a:link , .footerlinks a:visited {
	text-decoration:none;
	color:#6D6D6D;
}

/* About Us Page */
.aboutnavbar {
	background:url('../siteimg/aboutnavbar.jpg') repeat-x top right;
	padding-bottom:40px;
}

.aboutus h1 {
	font-size:14px;
	font:Verdana;
	font-weight:bold;
	padding-bottom:8px;
	color:#8d0e07;
}

/* My Account Page */
#orderlookup table tr td {
	border:0;
}

#orderlookup table {
	border:0;
}

.PYXMYACCOUNT {
	margin:0 auto;
	width:906px;
	color:#434343;
	font-family:Verdana;
	font-size:10px;
	font-weight:bold;
}

.PYXMYACCOUNT input.text {
	background:#FFFFFF none repeat scroll 0% 50%;
	border:1px solid #a5acb2;
	color:#555555;
	font-family:arial;
	font-size:11px;
	padding:3px;
	width:171px;
}



.PYXMYACCOUNT table {
}

.PYXMYACCOUNT table tr td {
	text-align:right;
	font-family:Verdana;
	font-size:10px;
	font-weight:bold;
}

.PYXMYACCOUNT table tr td:first-child {

}

#orderlookup tr td {
	vertical-align:top;
}

.MYACCOUNTMAIN tr:first-child {

}

.MYACCOUNTMAIN tr {

}

.pyxismain {

}

.pyxismain table, .pyxismain td, .pyxismain th {
	vertical-align:top;
}

/* Item Packages */
.ITEMPACKAGE {
	width:100%;
	float:left;
	border-top:1px solid #e6e6e6;
	font-family:Verdana;
	font-size:12px;
	line-height:20px;
	padding-bottom:35px;
}

.ITEMPACKAGE a:focus, .ITEMPACKAGE a:link , .ITEMPACKAGE a:visited {
	color:#7b0803;
	font-family:Verdana;
	font-size:10px;
	font-weight:bold;
} 

.ITEMPACKAGE a:hover {
	text-decoration:none;
}



.ITEMPACKAGE2 {
  width:10px;
  /*float:left;*/
  border-top:1px solid #e6e6e6;
  font-family:Verdana;
  font-size:12px;
  line-height:20px;
  padding-bottom:35px;
}

.ITEMPACKAGE2 a:focus, .ITEMPACKAGE a:link , .ITEMPACKAGE a:visited {
  color:#7b0803;
  font-family:Verdana;
  font-size:10px;
  font-weight:bold;
} 

.ITEMPACKAGE2 a:hover {
  text-decoration:none;
}











#packagescon {
	vertical-align:top;
}

.ITEMPACKAGECONTENTS {
	padding-left:10px;
	width:220px;
}

.ITEMPACKAGECONTENTS ol {
	font-family:Arial;
	font-size:10px;
	color:#2d2d2d;
	margin:0 1.5em;

}

.ITEMPACKAGECONTENTS ol li {
	line-height:15px;
}

.PACKAGEPRICESECTION {
	padding:25px;
	width:200px;
	/*background:url('../siteimg/packbox2.jpg') no-repeat;*/
	text-align:right;
	color:#525252;
}


.PACKAGEPRICESECTION2 {
  padding:25px;
  width:200px;
  float:right;
  /*background:url('../siteimg/packbox2.jpg') no-repeat;*/
  text-align:right;
  color:#525252;
}

.PACKAGEPRICESECTION2high {
  padding:10px 25px 25px 25px;
  width:600px;
  float:right;
  /*background:url('../siteimg/packbox2.jpg') no-repeat;*/
  text-align:right;
  color:#525252;
}

.PACKAGEPRICESECTION2highukdc {
  padding:10px 10px 10px 10px;
  /*padding:0px 0px 0px 0px;*/
  /*width:925px;*/
  width:705px;
  float:none;
  /*background:url('../siteimg/packbox2.jpg') no-repeat;*/
  text-align:left;
  color:#525252;
}



.PACKAGESHEADER a:focus, .PACKAGESHEADER a:link , .PACKAGESHEADER a:visited {
	font-family:Verdana;
	font-size:10px;
	color:#484848;
	text-decoration:none;
}




.packageslarge {
  /*blue*/
  color:#02aff0;
  /*grey*/
  /*color:#9aa0a2;*/
  /*background-color:#9aa0a2;*/
  padding:0px;
  padding-bottom:0px;
  padding-top:0px;
  font-family:Arial, Helvetica, sans-serif;
  font-size:21px;
  margin:0 auto;
}



.packagessmall {
  /*blue*/
  /*color:#02aff0;*/
  /*grey*/
  color:#9aa0a2;
  padding-left:50px;
  padding-right:50px;
  padding-bottom:0px;
  padding-top:0px;
  font-family:Arial, Helvetica, sans-serif;
  font-size:12px;
  margin-top:0px;
  margin-bottom:0px;
  margin-left:50px;
  margin-right:50px;
}









#tabcontents {
  margin-left:7px;
  width:931px;
  border-left:1px solid #e8eff2;
  border-right:1px solid #e8eff2;
}



#tabcontents2 {
  margin-left:7px;
  width:1931px;
  border-left:1px solid #e8eff2;
  border-right:1px solid #e8eff2;
}



.tabbottom{
  margin-left:7px;
  width:931px;
  height:9px;
  background:url(../siteimg/tabs-bot.gif);  
}
.PACKAGESHEADER a:hover {
	text-decoration:underline;
	padding-bottom:8px;
}

.ITEMPACKAGEHEADER a:focus, .ITEMPACKAGEHEADER a:hover, .ITEMPACKAGEHEADER a:link , .ITEMPACKAGEHEADER a:visited {
	color:#2e2e2e;
	text-decoration:none;
	padding-bottom:8px;
} 


/* reset.css */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin:0;padding:0;border:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;}
body {line-height:1.5;}
table {border-collapse:separate;border-spacing:0;}
caption, th, td {text-align:left;font-weight:normal;}
table, td, th {vertical-align:middle;}
blockquote:before, blockquote:after, q:before, q:after {content:"";}
blockquote, q {quotes:"" "";}
a img {border:0 none;}
* :focus { outline: 0; }

/* typography.css */
body {font-size:12px;color:#FFF;background:#fff;font-family:"Lucida Sans Unicode","Lucida Grande","Lucida Sans",Helvetica,Arial,sans-serif,"Bitstream Vera Sans";}
h1, h2, h3, h4, h5, h6 {font-weight:normal;color:#111;}
h1 {font-size:3em;line-height:1;margin-bottom:0.5em;}
h2 {font-size:2em;margin-bottom:0.75em;}
h3 {font-size:1.5em;line-height:1;margin-bottom:1em;}
h4 {font-size:1.2em;line-height:1.25;margin-bottom:1.25em;height:1.25em;}
h5 {font-size:1em;font-weight:bold;margin-bottom:1.5em;}
h6 {font-size:1em;font-weight:bold;}
h1 img, h2 img, h3 img, h4 img, h5 img, h6 img {margin:0;}
p {margin:0 0 1.5em;}
p img {float:left;margin:1.5em 1.5em 1.5em 0;padding:0;}
p img.right {float:right;margin:1.5em 0 1.5em 1.5em;}

/*this changes color of tabs, I am adding a img*/
a:focus, a:hover {color:#d5d5d5; text-decoration: none;}
a {color:#d5d5d5;text-decoration:none;}
a img {text-decoration:none;}
/*img a {text-decoration: none;}*/
/*
a img {
border-bottom:30px solid black
}
*/



blockquote {margin:1.5em;color:#666;font-style:italic;}
strong {font-weight:bold;}
em, dfn {font-style:italic;}
dfn {font-weight:bold;}
sup, sub {line-height:0;}
abbr, acronym {border-bottom:1px dotted #666;}
address {margin:0 0 1.5em;font-style:italic;}
del {color:#666;}
pre, code {margin:1.5em 0;white-space:pre;}
pre, code, tt {font:1em 'andale mono', 'lucida console', monospace;line-height:1.5;}
li ul, li ol {margin:0 1.5em;}
ul, ol {margin:0 1.5em 1.5em 1.5em;}
ul {list-style-type:disc;}
ol {list-style-type:decimal;}
dl {margin:0 0 1.5em 0;}
dl dt {font-weight:bold;}
dd {margin-left:1.5em;}
table {width:100%;}
th {font-weight:bold;background:#C3D9FF;}
th, td {padding:4px 10px 4px 5px;}
tr.even td {background:#E5ECF9;}
tfoot {font-style:italic;}
caption {background:#eee;}
.small {font-size:.8em;margin-bottom:1.875em;line-height:1.875em;}
.large {font-size:1.2em;line-height:2.5em;margin-bottom:1.25em;}
.hide {display:none;}
.quiet {color:#666;}
.loud {color:#000;}
.highlight {background:#ff0;}
.added {background:#060;color:#fff;}
.removed {background:#900;color:#fff;}
.first {margin-left:0;padding-left:0;}
.last {margin-right:0;padding-right:0;}
.top {margin-top:0;padding-top:0;}
.bottom {margin-bottom:0;padding-bottom:0;}

/* grid.css */
.container{width:951px;margin: 0 auto; /*background:#ffffff url(../siteimg/c-bg.gif) repeat-y;*/}
.container2{width:951px;margin: 0 auto; background:#ffffff url(../siteimg/c-bg2.gif) repeat-y;}
.showgrid {background:url(src/grid.png);}
/*body { margin:10px;background:#edf3f3;}*/
body { margin:10px;background:#f6f6f6 url(../siteimg/checkered-bg.gif) repeat-x;}
div.span-1, div.span-2, div.span-3, div.span-4, div.span-5, div.span-6, div.span-7, div.span-8, div.span-9, div.span-10, div.span-11, div.span-12, div.span-13, div.span-14, div.span-15, div.span-16, div.span-17, div.span-18, div.span-19, div.span-20, div.span-21, div.span-22, div.span-23, div.span-24 {float:left;margin-right:10px;}
div.last {margin-right:0;}
.span-1 {width:30px;}
.span-2 {width:70px;}
.span-3 {width:110px;}
.span-4 {width:150px;}
.span-5 {width:190px;}
.span-6 {width:230px;}
.span-7 {width:270px;}
.span-8 {width:310px;}
.span-9 {width:350px;}
.span-10 {width:390px;}
.span-11 {width:430px;}
.span-12 {width:470px;}
.span-13 {width:510px;}
.span-14 {width:550px;}
.span-15 {width:590px;}
.span-16 {width:630px;}
.span-17 {width:670px;}
.span-18 {width:710px;}
.span-19 {width:750px;}
.span-20 {width:790px;}
.span-21 {width:830px;}
.span-22 {width:870px;}
.span-23 {width:910px;}
.span-24, div.span-24 {width:950px;margin:0;}
.append-1 {padding-right:40px;}
.append-2 {padding-right:80px;}
.append-3 {padding-right:120px;}
.append-4 {padding-right:160px;}
.append-5 {padding-right:200px;}
.append-6 {padding-right:240px;}
.append-7 {padding-right:280px;}
.append-8 {padding-right:320px;}
.append-9 {padding-right:360px;}
.append-10 {padding-right:400px;}
.append-11 {padding-right:440px;}
.append-12 {padding-right:480px;}
.append-13 {padding-right:520px;}
.append-14 {padding-right:560px;}
.append-15 {padding-right:600px;}
.append-16 {padding-right:640px;}
.append-17 {padding-right:680px;}
.append-18 {padding-right:720px;}
.append-19 {padding-right:760px;}
.append-20 {padding-right:800px;}
.append-21 {padding-right:840px;}
.append-22 {padding-right:880px;}
.append-23 {padding-right:920px;}
.prepend-1 {padding-left:40px;}
.prepend-2 {padding-left:80px;}
.prepend-3 {padding-left:120px;}
.prepend-4 {padding-left:160px;}
.prepend-5 {padding-left:200px;}
.prepend-6 {padding-left:240px;}
.prepend-7 {padding-left:280px;}
.prepend-8 {padding-left:320px;}
.prepend-9 {padding-left:360px;}
.prepend-10 {padding-left:400px;}
.prepend-11 {padding-left:440px;}
.prepend-12 {padding-left:480px;}
.prepend-13 {padding-left:520px;}
.prepend-14 {padding-left:560px;}
.prepend-15 {padding-left:600px;}
.prepend-16 {padding-left:640px;}
.prepend-17 {padding-left:680px;}
.prepend-18 {padding-left:720px;}
.prepend-19 {padding-left:760px;}
.prepend-20 {padding-left:800px;}
.prepend-21 {padding-left:840px;}
.prepend-22 {padding-left:880px;}
.prepend-23 {padding-left:920px;}
div.border {padding-right:4px;margin-right:5px;border-right:1px solid #eee;}
div.colborder {padding-right:24px;margin-right:25px;border-right:1px solid #eee;}
.pull-1 {margin-left:-40px;}
.pull-2 {margin-left:-80px;}
.pull-3 {margin-left:-120px;}
.pull-4 {margin-left:-160px;}
.pull-5 {margin-left:-200px;}
.pull-6 {margin-left:-240px;}
.pull-7 {margin-left:-280px;}
.pull-8 {margin-left:-320px;}
.pull-9 {margin-left:-360px;}
.pull-10 {margin-left:-400px;}
.pull-11 {margin-left:-440px;}
.pull-12 {margin-left:-480px;}
.pull-13 {margin-left:-520px;}
.pull-14 {margin-left:-560px;}
.pull-15 {margin-left:-600px;}
.pull-16 {margin-left:-640px;}
.pull-17 {margin-left:-680px;}
.pull-18 {margin-left:-720px;}
.pull-19 {margin-left:-760px;}
.pull-20 {margin-left:-800px;}
.pull-21 {margin-left:-840px;}
.pull-22 {margin-left:-880px;}
.pull-23 {margin-left:-920px;}
.pull-24 {margin-left:-960px;}
.pull-1, .pull-2, .pull-3, .pull-4, .pull-5, .pull-6, .pull-7, .pull-8, .pull-9, .pull-10, .pull-11, .pull-12, .pull-13, .pull-14, .pull-15, .pull-16, .pull-17, .pull-18, .pull-19, .pull-20, .pull-21, .pull-22, .pull-23, .pull-24 {float:left;position:relative;}
.push-1 {margin:0 -40px 1.5em 40px;}
.push-2 {margin:0 -80px 1.5em 80px;}
.push-3 {margin:0 -120px 1.5em 120px;}
.push-4 {margin:0 -160px 1.5em 160px;}
.push-5 {margin:0 -200px 1.5em 200px;}
.push-6 {margin:0 -240px 1.5em 240px;}
.push-7 {margin:0 -280px 1.5em 280px;}
.push-8 {margin:0 -320px 1.5em 320px;}
.push-9 {margin:0 -360px 1.5em 360px;}
.push-10 {margin:0 -400px 1.5em 400px;}
.push-11 {margin:0 -440px 1.5em 440px;}
.push-12 {margin:0 -480px 1.5em 480px;}
.push-13 {margin:0 -520px 1.5em 520px;}
.push-14 {margin:0 -560px 1.5em 560px;}
.push-15 {margin:0 -600px 1.5em 600px;}
.push-16 {margin:0 -640px 1.5em 640px;}
.push-17 {margin:0 -680px 1.5em 680px;}
.push-18 {margin:0 -720px 1.5em 720px;}
.push-19 {margin:0 -760px 1.5em 760px;}
.push-20 {margin:0 -800px 1.5em 800px;}
.push-21 {margin:0 -840px 1.5em 840px;}
.push-22 {margin:0 -880px 1.5em 880px;}
.push-23 {margin:0 -920px 1.5em 920px;}
.push-24 {margin:0 -960px 1.5em 960px;}
.push-1, .push-2, .push-3, .push-4, .push-5, .push-6, .push-7, .push-8, .push-9, .push-10, .push-11, .push-12, .push-13, .push-14, .push-15, .push-16, .push-17, .push-18, .push-19, .push-20, .push-21, .push-22, .push-23, .push-24 {float:right;position:relative;}
.box {padding:1.5em;margin-bottom:1.5em;background:#E5ECF9;}
hr {background:#ddd;color:#ddd;clear:both;float:none;width:100%;height:.1em;margin:0 0 1.45em;border:none;}
hr.space {background:#fff;color:#fff;}
.clearfix:after, .container:after {content:".";display:block;height:0;clear:both;visibility:hidden;}
.clearfix, .container {display:inline-block;}
* html .clearfix, * html .container {height:1%;}
.clearfix, .container {display:block;}
.clear {clear:both;}

/* forms.css */
label {font-weight:bold;}
fieldset {padding:1.4em;margin:0 0 1.5em 0;border:1px solid #ccc;}
legend {font-weight:bold;font-size:1.2em;}
input.text, input.title, textarea, select {margin:0.5em 0;border:1px solid #bbb;}
input.text:focus, input.title:focus, textarea:focus, select:focus {border:1px solid #666;}
input.text, input.title {width:300px;padding:5px;}
input.title {font-size:1.5em;}
textarea {width:390px;height:250px;padding:5px;}
.error, .notice, .success {padding:.8em;margin-bottom:1em;border:2px solid #ddd;}
.error {background:#FBE3E4;color:#8a1f11;border-color:#FBC2C4;}
.notice {background:#FFF6BF;color:#514721;border-color:#FFD324;}
.success {background:#E6EFC2;color:#264409;border-color:#C6D880;}
.error a {color:#8a1f11;}
.notice a {color:#514721;}
.success a {color:#264409;}

Open in new window

0
 
LVL 16

Expert Comment

by:SSupreme
ID: 36899955
try this: behavior: url(border-radius.htc)\9;
so basically you need to add "\9"
0
 

Author Closing Comment

by:rgb192
ID: 36900100
thanks
0
 

Author Comment

by:rgb192
ID: 36900123
I have a related question


because your answer deleted the side borders along the edge of the body

http://www.experts-exchange.com/Web_Development/Web_Languages-Standards/CSS/Q_27376237.html
0

Featured Post

How to improve team productivity

Quip adds documents, spreadsheets, and tasklists to your Slack experience
- Elevate ideas to Quip docs
- Share Quip docs in Slack
- Get notified of changes to your docs
- Available on iOS/Android/Desktop/Web
- Online/Offline

Join & Write a Comment

Suggested Solutions

Title # Comments Views Activity
Hover Gone 16 31
Safari SVG Image Problem 1 21
Urgent need help ASAP With CSS 5 24
get multiple images to align right 5 11
CSS3 Custom checkboxes This article shows how to style the checkbox form element using only CSS. Works in: Chrome, FF, Safari, Opera, IE9+ Uses modernizr.js to check for :checked pseudo class, falling back to plain old checkboxes (IE8 and bel…
So you have coded your own WordPress plugin and now you want to allow users to upload images to a folder in the plugin folder rather than the default media location? Follow along and this article will show you how to do just that!
In this tutorial viewers will learn how to define a gradient in CSS. Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Gradient. Define the background as "linear-gradient(to right, #ee3668, black)". Ensure you …
In this tutorial viewers will learn how to style rounded corners for elements in CSS using the border-radius property Begin with a normal styled element such as a div: To style all four corners of the div to be the same degree of roundness, use the …

747 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

13 Experts available now in Live!

Get 1:1 Help Now