子弹不会在Firefox中消失



希望您能帮助我解决问题。我无法摆脱Firefox中的子弹,我不想在任何地方,因此我的列表式型:无!据我所知,它仅出现在Firefox中。

html ....

<!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" lang="en" xml:lang="en">
 <head>
    <title>littleprints.nl</title>
    <meta name="description" content="----" />
    <meta name="keywords" content="----" />
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
    <script type="text/javascript" src="js/slimbox2.js"></script>
    <link rel="stylesheet" href="css/slimbox2.css" type="text/css" media="screen" />
    <link rel="stylesheet" href="layout.css"/>
    <link rel="stylesheet" href="style.css"/>
 </head>
 <body>
    <div id="container">
      <div id="inline1">
         <div id="mainpic">
            <img src="myimages/circle.jpg" width="100%" alt="Circle bracelet"/>
         </div>
         <div id="intro">
            <p>Hi and welcome to little prints NL. we make this and that all by hand with 100% silver. my name is Donna Burns and i work by commision, ive been studying for 4 years and am currently learning to become a goldsmith.</p>
         </div>
      </div>
      <div id="inline2">
         <p>Click for more...</p>
         <div id="images">
            <a href="myimages/photos/dogtag.jpg" rel="lightbox-gal" title="Beautiful, isn't it?" ><img src="myimages/work/chunky.gif" alt="chunky"/></a>
            <a href="myimages/photos/hearts.jpg" rel="lightbox-gal" title="Beautiful, isn't it?" ><img src="myimages/work/hearts.gif" alt="hearts"/></a>        
            <a href="myimages/photos/close.jpg" rel="lightbox-gal" title="Beautiful, isn't it?" ><img src="myimages/work/close.gif" alt="close"/></a>       
            <a href="myimages/photos/pearl.jpg" rel="lightbox-gal" title="Beautiful, isn't it?" >&nbsp;</a>
            <a href="myimages/photos/flower.jpg" rel="lightbox-gal" title="Beautiful, isn't it?" >&nbsp;</a>
            <a href="myimages/photos/frontcircle.jpg" rel="lightbox-gal" title="Beautiful, isn't it?" >&nbsp;</a>       
            <a href="myimages/photos/dogtag.jpg" rel="lightbox-gal" title="Beautiful, isn't it?" >&nbsp;</a> 
        </div>
     </div>
</div><!--end container-->
<div id="footer">
    <div id="footalign">
       <div id="social">
         <ul>
            <li>
              <a href="http://www.facebook.com/littleprints" title="Little Prints">
                 <img src="myimages/facebook.png" width="50px" height="50px" alt="FB"/>
              </a>
           </li>
           <li>
             <a href="contact.html" title="contact">
                <img src="myimages/at.gif" alt="@"/>
             </a>
           </li>
        </ul>

      </div>
      <div id="contact">
         <p><br/>To enquire about a charm either phone:<br/> 0787463289<br/> or use one of the methods to the side.</p>
      </div>

    </div>
 </div>
 </body>
</html>

CSS ...

* {margin: 0; padding: 0; border: 0;}
html, body {
    background-color: #000000;image;
    text-align: center;
    font: 16px/1.8 Verdana, Arial, Helvetica, sans-serif;
    list-style-type: none!important;
    text-decoration: none;
}
#container {
    position: relative;
    width: 900px;
    top: 0;
    min-height: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-top: 20px;
    background-image: URL(myimages/back2.gif);
    margin-bottom: 180px;
}
#footer {
    background-color: #555555;
    position: relative;
    clear: both;
    bottom: 0;
    width: 900px;
    height: auto;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
    padding-bottom: 22px;
    margin-top: -180px;
}
#inline1{
    display: inline-block;
    margin-top: 250px;
    margin-bottom: 20px;
}
#inline2 {
    display: inline-block;
    margin-top: 30px;
    margin-bottom: 50px;
}
#mainpic {
    float: left;
    width: 68%;
    margin-left: 20px;
}
#intro {
    float: right;
    width: 20%;
    margin-left: auto;
    margin-right: 50px;
    margin-top: 20px;
}
#images {
    margin-bottom: 20px;
    margin-left: auto;
    margin-right: auto;
}
#footalign {
    display: inline;
    width:900px;
    list-style-type: none;
}
#contact {
    text-align: center;
    background-color:#555555;
    float: middle;
    list-style-type: none;
}
#social{
    background-color:#555555;
    float: right;
    list-style: none;
    padding:0;
    padding-right: 5px;
    text-align:center;
    list-style-type: none!important;
}
#social  img{
    border: none;
    list-style-type: none!important;
    margin: 3px;
}
#social ul{
    border: none;
    list-style-type: none!important;
}
#social a{
    display:inline-block;
    -webkit-transition:all .5s ease-out;
    -moz-transition:all .5s ease-out;
    -ms-transition:all .5s ease-out;
    -o-transition:all .5s ease-out;
    transition:all .5s ease-out;
    list-style-type: none!important;
}
#social a:hover{
    display:inline-block;
    -webkit-transform:translate(-10px,0px);
    -moz-transform:translate(0px,-10px);
    -ms-transform:translate(-10px,0px);
    -o-transform:translate(-10px,0px);
    transform:translate(-10px,0px);
    list-style-type: none!important;
}
#form {
    margin-top: 250px;
    margin-bottom: 50px;
}
.nav1
    {font-family: sans-serif;font-size: 22px;text-shadow: 2px 2px 5px #000000;}
    a:link {text-decoration:none; color:#000000; padding:3px;}
    a:visited {text-decoration:none; color:#000000;}
    a:active {text-decoration:none; color:#555555;}
    a:hover {text-decoration:none; color:#555555;}
.nav2
    {font-family: sans-serif;font-size: 22px;text-shadow: 2px 2px 5px #ffffff;}
    a:link {text-decoration:none; color:#ffffff; padding:3px;}
    a:visited {text-decoration:none; color:#ffffff;}
    a:active {text-decoration:none; color:#555555;}
    a:hover {text-decoration:none; color:#555555;}
.p1 {
    color: #ffffff;
}
div#images img {
    max-width: 500px;
    height: auto;
}

尝试:

#social ul {
border: none;
list-style: none!important;
}

仅使用list-style可能会简化它。但是无论如何,我在Firefox中,但我没有看到任何要点。

您可能想尝试为我们为JSFiddle设置测试用例。只需发布这样的代码,有时是干草堆中的针头!

http://jsfiddle.net/

祝你好运。

ps-将list-style放在下面的代码上是没有意义的,因为您要指定img标签!

#social img {
border: none;
list-style-type: none!important;
margin: 3px;
}

更新:

出于争论的缘故(因为我看不到您的应用程序的工作原理),请尝试为您的列表设置全局默认样式:

ul, ol { list-style: none; }

另外,我知道在一些较旧的浏览器中,将其设置在实际LI本身上也有帮助(尽管我可能错了):

li { list-style: none; }

相关内容

  • 没有找到相关文章

最新更新