0

我的（非常简单的）测试代码在 Chrome 和 Firefox（http://i.imgur.com/5vCoV.png）中正确居中，但在 Safari 中显示不正确。相反，它看起来像这样：http: //i.imgur.com/qDq9M.png

我只在 Mac 上测试过。

这是我的代码：

<!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>Untitled Document</title>

<style type="text/css">
    @charset "utf-8";

body {
    background-color: #ccc;
    font-family: Verdana, Geneva, sans-serif;
    height: auto;
    width: auto;
    font-size: 80%;
    margin: 0;
    padding: 0;
}

#main {
    text-align: center;
}

</style>

</head>

<body>

<CFIF NOT ISDEFINED("FORM.SUBMIT")>
    <div id="main">
        <cfform format="flash" action="" skin="haloorange" width="798" height="540" style="background-color: ##999999; margin-top:8px; margin-left: 38px;">
        <cfformgroup type="panel" label="APPLICATION" width="790" style="background-color:##DDDDDD">
                <CFINPUT label="First Name" TYPE="Text" NAME="fname" MESSAGE="First Name required." value="Ahmed" REQUIRED="Yes" tooltip="Enter your first name." width="298">
                <CFINPUT label="Last Name" TYPE="Text" NAME="lname" MESSAGE="Last Name required." value="Osman" REQUIRED="Yes" tooltip="Enter your last name." width="298">
                <CFINPUT TYPE="submit" width="49" NAME="submit" value="Submit" tooltip="Save your name.">
            </cfformgroup>
        </cfform>
    </div>
<CFELSE>
    <cfdump var="#FORM#">
</CFIF>

</body>
</html>

编辑：

这是渲染的 HTML 代码，感谢 reiso：

<!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><script type="text/javascript" src="/CFIDE/scripts/cfform.js"></script>
<script type="text/javascript" src="/CFIDE/scripts/masks.js"></script>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>

<style type="text/css">
    @charset "utf-8";

    body {
        background-color: #ccc;
        font-family: Verdana, Geneva, sans-serif;
    height: auto;
    width: auto;
    font-size: 80%;
    margin: 0;
    padding: 0;
}

#main {
    padding: 0;
    width: 100%;
    text-align: center;
    }

</style>

</head>

<body>

<div id="main">
<script type="text/javascript" charset='utf-8' src='/CFIDE/scripts/cfformhistory.js'>   </script>
<noscript>
<object classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000'
 id='CFForm_1'
 codebase='http://www.macromedia.com/go/getflashplayer#version=7,0,14,0'
 width='798'
 height='540'>
  <param name='wMode' value='Window'/>
  <param name='src' value='/zip/1613302191.mxml.cfswf'/>
  <param name='flashVars'   value='%5F%5FCFForm%5F1%5Fcacheid=ED542456%2DBAD9%2DED93%2DE8B94655D75F224D'/>
<embed pluginspage='http://www.macromedia.com/go/getflashplayer' id='CFForm_1' src='/zip/1613302191.mxml.cfswf' width='798' height='540' wMode='Window' flashVars='%5F%5FCFForm%5F1%5Fcacheid=ED542456%2DBAD9%2DED93%2DE8B94655D75F224D' ></embed>  </object>
</noscript>
<script type="text/javascript" charset='utf-8' src='/CFIDE/scripts/CF_RunActiveContent.js'></script>
<script type="text/javascript" charset='utf-8'>
CF_RunContent('<object classid=\'clsid:D27CDB6E-AE6D-11cf-96B8-444553540000\'  codebase=\'http://www.macromedia.com/go/getflashplayer#version=7,0,14,0\' width=\'798\'  height=\'540\'>\n  <param name=\'src\' value=\'/zip/1613302191.mxml.cfswf\'/>\n    <param  name=\'wMode\' value=\'Window\'/>\n    <param name=\'flashVars\'  value=\'historyUrl=%2FCFIDE%2Fscriptscfformhistory%2Ecfm%3F&lconid=" + lc_id  +"&%5F%5FCFForm%5F1%5Fcacheid=ED542456%2DBAD9%2DED93%2DE8B94655D75F224D\'/>\n<embed pluginspage=\'http://www.macromedia.com/go/getflashplayer\' \n   id=\'CFForm_1\' \n   src=\'/zip/1613302191.mxml.cfswf\' \n   width=\'798\' \n   height=\'540\' \n   wMode=\'Window\' \n   flashVars=\'historyUrl=%2FCFIDE%2Fscriptscfformhistory%2Ecfm%3F&lconid=" + lc_id +"&%5F%5FCFForm%5F1%5Fcacheid=ED542456%2DBAD9%2DED93%2DE8B94655D75F224D\'  >\n</embed>\n</object>\n');
</script>
<script type="text/javascript" charset='utf-8'>
    document.write("<br><iframe src='/CFIDE/scripts/cfformhistory.cfm' name='_history'  frameborder='0' scrolling='no' width='22' height='0'></iframe></br> ");
</script>

</div>


</body>
</html>

谢谢

4

1 回答 1

0

尚未对其进行测试，但请尝试将此作为您的#main 样式：

#main {
 width: 798px; /* same as your cfform's width value */
 padding: 0;
 margin: 0 auto; /* this shoudl center the container on the page */
}

并从cfform 标记中的style属性中删除所有margin-*声明

于 2012-06-04T05:51:30.833 回答