Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS list-style-image not working in IE

  • This topic is empty.
Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #23098
    brianatlarge
    Member

    Website:
    http://www.studentseatfree.com/coupon.php?1

    So on this coupon, the background is set using list-style-image in the css. I used list-style-image instead of background:url() because these coupons need to print, and the browser doesn’t include background images when printed.

    This method works fine in Firefox or Safari but in IE, the background does not show up at all.

    Is there a particular way I need to do my code so that IE acknowledges the list-style-image?

    Thanks.

    HTML:

    Code:



    Students Eat Free Special Coupon

    Boysenberry Hullabaloo

    $5 off any order $25 or more
    Valid only at:
    Boysenberry Hullabaloo – 123 Meow Yes Way, Charlotte, NC 28210



    CSS:

    Code:
    * { margin: 0; padding: 0; }

    body
    {
    font-family: Helvetica, Arial, Verdana, sans-serif;
    font-size:12px;
    color:#446a31;
    background:#ffffff;
    }

    .couponback
    {
    position: absolute;
    top:20px;
    left:20px;
    display: list-item;
    list-style-image: url(images/coupon.jpg);
    list-style-position: inside;
    width:400px;
    height:250px;
    min-height:250px;
    }

    .coupon
    {
    position: absolute;
    top:20px;
    left:20px;
    width:400px;
    height:250px;
    min-height:250px;
    padding:10px;
    border-width:2px;
    border-style:dashed;
    border-color:#000000;
    }

    img.logo
    {
    width:75px;
    height:100px;
    min-height:100px;
    float:left;
    display:inline;
    }

    .restname
    {
    position:relative;
    left:-180px;
    width:135px;
    float:right;
    display:inline;
    font-size:25px;
    font-weight:bold;
    }

    .discdescription
    {
    font-size:25px;
    font-weight:bold;
    }

    .restlocation
    {
    position:relative;
    top:20px;
    font-size:15px;
    font-weight:bold;
    }

    .couponsubmit
    {
    position: absolute;
    top:320px;
    left:160px;
    }

    #49251
    chazzwick
    Member

    couldnt you just make the whole thing an image? it would save all this effort, and would work in every browser

Viewing 2 posts - 1 through 2 (of 2 total)
  • The forum ‘CSS’ is closed to new topics and replies.