我使用css和div标签设计了一个网站。它在IE 8中运行良好,但在Firefox中无法正常工作。某些页面的Firefox会出现一些解决问题。
这个问题是由于css还是div?
这是我的css样式表...
@charset "utf-8";
/* CSS Document */
a.bottom:link,a.bottom:visited,a.bottom:active
{
/*display:compact;*/
font-family:Arial, Helvetica, sans-serif;
font-size:16px;
font-weight:normal;
color:#FFFFFF;
background-color:#BF007F;
text-align:center;
padding:10px;
text-decoration:none;
}
a.bottomClick:link,a.bottomClick:visited,a.bottomClick:active
{/*display:compact;*/
font-family:Arial, Helvetica, sans-serif;
font-size:16px;
font-weight:normal;
color:#BF007F;
background-color:#F0F0F0;
text-align:center;
padding:10px;
text-decoration:none;
}
.MainHeading {
font-family:Arial, Helvetica, sans-serif;
font-size:18px;
color:#000000;
font-weight:bold;
}
.HeadingOfContentBox {
font-family:Arial, Helvetica, sans-serif;
font-size:16px;
color:#000000;
font-weight:bold;
}
.ContentText {
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
color:#000000;
font-weight:normal;
}
#ContentTable
{
font-family: Arial, Helvetica, sans-serif;
background-color:#F0F0F0;
background-repeat:repeat-y;
width:960px;
}
ul
{
list-style-type:none;
padding:4px;
margin:0px;
font-family:Arial, Helvetica, sans-serif;
}
li
{
background-image:url();
background-repeat:no-repeat;
background-position:0px 5px;
padding-left:18px;
font-family:Arial, Helvetica, sans-serif;
line-height:1.5;
margin-left:20px;
margin-right:20px;
}
ul.unorder
{
list-style-type:none;
padding:0px;
margin:0px;
font-family:Arial, Helvetica, sans-serif;
}
li.unorder
{
background-image:none;
background-position:0px 5px;
padding-left:14px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#000000;
font-weight:normal;
}
A.topLink:Link {
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#bf007f;
text-decoration:underline;
font-weight:bold;
}
A.topLink:hover {
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#bf007f;
text-decoration:underline;
font-weight:bold;
}
A.topLink:Visited {
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#bf007f;
text-decoration:underline;
font-weight:bold;
}
#framecontentLeft{
top: 0;
left: 0;
width:320px; /*Width of left frame div*/
float:left;
background-image:url(../images/varioCatering02_02.png);
color: white;
}
#framecontentRight{
left: auto;
right: 0;
float:right;
width: 320px; /*Width of right frame div*/
background-image:url();
color: white;
}
#maincontent{
width:960px;
}
.innertube{
margin: 15px; /*Margins for inner DIV inside each DIV (to provide padding)*/
}
#divleft
{
float:left;
}
#divright
{
float:right;
}
p
{
text-align:justify;
padding:10px;
line-height:1.5;
margin-left:10px;
margin-right:10px;
margin-top:0px;
}
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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>dimari - efficient customer solutions for your industry</title>
<style type="text/css">
<!--
body {
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
margin-bottom: 0px;
background-image:url();
background-repeat: repeat-x;
}
-->
</style>
<link href="css/CssStyleSheet.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="framecontentLeft"> </div>
<div align="center">
<div id="maincontent">
<div style="height:10px;"></div>
<div id="divleft">LogoImage with hyperlink</div>
<div id="divright"> <a class="topLink" href="Kontakt.html">Kontakt</a> <a class="topLink" href="Impressum.html">Impressum</a> </div>
<div style="height:80px"> </div>
<div align="center" style="margin-bottom:10px;">BannerImage</div>
<div id="maincontent" style="margin-bottom:8px;">
<div style="height:10px;"></div>
<div id="divright" > <b class="MainHeading">Hyperlink</a></b> <b class="MainHeading">HyperLink</b> </div>
</div>
<br/>
<div id="maincontent" >
<div id="ContentTable">
<div id="divleft">
<div align="left">
<h3 class="HeadingOfContentBox" style="text-align:left;padding:10px; margin-left:10px;margin-right:10px">Schulen/Eltern</h3>
</div>
<p class="ContentText" style="width:960px;"> </p>
</div>
</div>
</div>
<div id="maincontent">
<div id="ContentTable" style="height:450px;">
<div style="float:left; margin-left:15px;display: inline;" ><span style="text-align:left" >
<h4 class="ContentText" style="margin-left:10px;margin-right:10px;padding:10px;"> Argumente:</h4>
<ul>
<li> <span class="ContentText">Bargeldloses Bezahlen</span></li>
<li class="ContentText">Sicherer Online Login </li>
<li class="ContentText">Abrechnung pro Gramm > Kind dosiert sich je nach Hunger Essen > wenn mehr Hunger, Nachtisch holen und bequem wieder per Karte bezahlen </li>
<li class="ContentText"> Schnellere Essensausgabe > Kind/Lehrer mehr Zeit zum Essen an sich </li>
<li class="ContentText">Essen ohne Vorbestellung </li>
<li class="ContentText">Sicherer online Login </li>
<li class="ContentText">Übersichtlichkeit: Nutzungsdaten, Bankdaten, Guthaben, Gekauftes Essen </li>
<li class="ContentText"> Anmeldung auch ohne Emailadresse, einfach telefonisch </li>
<li class="ContentText">Ampelstatus im online Account: Angabe wie viel Restguthaben vorhanden </li>
<li class="ContentText">Automat. Benachrichtigung über Restguthaben </li>
</ul>
</span> </div>
</div>
</div>
<div id="maincontent">
<div id="ContentTable">
<p>
<!-- Add your text here-->
<!-- Add your text here-->
<!-- Add your text here-->
</p>
<p></p>
</div>
</div>
</div>
</div>
<div id="framecontentRight"> </div>
</body>
</html>
答案 0 :(得分:-1)
我尝试使用我的mozilla浏览器看起来很完美如果你遇到问题只是复制那个特定的css行并作为示例background : #fff;
并添加此行-moz-background : #fff;
现在css看起来像这样
-moz-background : #fff;
background : #fff;
两者都将在那里...... moz将使mozilla与所有浏览器支持兼容另一个....我希望这将有助于你