Yankeecandleswholesale

dividing line with HR background image

Recently I wanted a nice dotted Dividing line on the website using CSS to create. As we know, however, the standard will be formatted with CSS in Internet Explorer 6.x (IE6) misrepresented. The browser inteprets as dotted dashed and dotted line appears then instead of dots, not what Absolut fits into the design. So I thought about the line to format so that the dotted graph is simply a background image.

On the Internet there is some information, but there are solutions that do not work or are just not made for a floated design.


Here are some examples that DO NOT worked in my case:

• HR with a background image using absolute positioning and CROP (rect) function
  Unfortunately, this approach does not work correctly in a floated Design ...
  
  
• HR Border in IE with ZOOM feature trick
  interesting approach that worked with me strength not 100% ...
  

So I had no choice other than the solution of Marek Sovavsiti create an additional means of DIV element over the separating line (HR), which looks like this:

HTML:

\u0026lt;div class = " hr "> \u0026lt;hr /> \u0026lt;/ div>


CSS:

div.hr
{height: 15px;
background: # fff url (.. / images / hr.gif) repeat-x scroll center;}

div # teaser div.hr hr
{display: none;}