首页 新闻 搜索 专区 学院

css布局IE6错乱,FF不会,请问原因

0
悬赏园豆:15 [已关闭问题] 关闭于 2008-09-10 22:36

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Test003.aspx.cs" Inherits="TerminalServer.Test003" %>

<!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 runat="server">
    <title>无标题页</title>
    <style type="text/css">
<!--
body {
     margin: 0px;
     padding: 0px;
}
div#header {
     clear: both;
     height: 50px;
     background-color: aqua;
     padding: 1px;
}
div#left {
     float: left;
     width: 150px;
     background-color: red;
}
div#right {

     float: right;
     width: 150px;
     background-color: green;
}
div#middle {
width:100%;
     padding: 0px 160px 5px 160px;
     margin: 0px;
     background-color: silver;
}
div#footer {
     clear: both;
     background-color: yellow;
}
-->
</style>
</head>
<body>
    <form id="form1" runat="server">
    <div id="header">
     <h1>Header</h1>
</div>
<div id="left">
     Port side text...
    <br />
    Port side text..<br />
    Port side text..<br />
    Port side text..Port side text..<br />
    Port side text..<br />
    Port side text..<br />
    Port side text..<br />
    Port side text..<br />
    Port side text..</div>
<%--<div id="right">
     Starboard side text...
    <br />
    Starboard side text..<br />
    Starboard side text..<br />
    Starboard side text..Starboard side text..<br />
    Starboard side text..<br />
    Starboard side text..<br />
    Starboard side text..<br />
    Starboard side text..<br />
    Starboard side text..Starboard side text..Starboard side text..<br />
    Starboard side text..</div>--%>
<div id="middle">
    hhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh
     <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" CellPadding="4"
                        DataKeyNames="ProductID" DataSourceID="SqlDataSource1" ForeColor="#333333" GridLines="None">
                        <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                        <Columns>
                            <asp:BoundField DataField="ProductID" HeaderText="ProductID" InsertVisible="False"
                                ReadOnly="True" SortExpression="ProductID" />
                            <asp:BoundField DataField="ProductName" HeaderText="ProductName" SortExpression="ProductName" />
                            <asp:BoundField DataField="SupplierID" HeaderText="SupplierID" SortExpression="SupplierID" />
                            <asp:BoundField DataField="CategoryID" HeaderText="CategoryID" SortExpression="CategoryID" />
                            <asp:BoundField DataField="QuantityPerUnit" HeaderText="QuantityPerUnit" SortExpression="QuantityPerUnit" />
                            <asp:BoundField DataField="UnitPrice" HeaderText="UnitPrice" SortExpression="UnitPrice" />
                         
                            <asp:BoundField DataField="UnitPrice" HeaderText="UnitPrice" SortExpression="UnitPrice" />
                            <asp:BoundField DataField="UnitPrice" HeaderText="UnitPrice" SortExpression="UnitPrice" />
                            <asp:BoundField DataField="UnitPrice" HeaderText="UnitPrice" SortExpression="UnitPrice" />
                            <asp:BoundField DataField="UnitPrice" HeaderText="UnitPrice" SortExpression="UnitPrice" />
                            <asp:BoundField DataField="UnitPrice" HeaderText="UnitPrice" SortExpression="UnitPrice" />
                            <asp:BoundField DataField="UnitPrice" HeaderText="UnitPrice" SortExpression="UnitPrice" />
                            <asp:BoundField DataField="UnitsInStock" HeaderText="UnitsInStock" SortExpression="UnitsInStock" />
                            <asp:BoundField DataField="UnitsOnOrder" HeaderText="UnitsOnOrder" SortExpression="UnitsOnOrder" />
                            <asp:BoundField DataField="ReorderLevel" HeaderText="ReorderLevel" SortExpression="ReorderLevel" />
                            <asp:CheckBoxField DataField="Discontinued" HeaderText="Discontinued" SortExpression="Discontinued" />
                        </Columns>
                        <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
                        <EditRowStyle BackColor="#999999" />
                        <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
                        <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
                        <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                        <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
                    </asp:GridView>
</div>
<div id="footer">
     Footer text...
</div>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:N%>"
            SelectCommand="SELECT * FROM [Products]"></asp:SqlDataSource>
    </form>
</body>
</html>orthwindConnectionString
firefox下显示正确,但是IE6却错乱了,请问什么原因

 

jeems的主页 jeems | 初学一级 | 园豆:115
提问于:2008-08-30 01:21
< >
分享
所有回答(4)
0
各浏览器对css解析方式不同,故而会导致浏览器兼容问题. 具体解决方案你可以先查阅 CssHack , 更多的还是实际工作中经验问题. 不过html以及css写规范了,出现不兼容的情况是不会太多的!
兔兔.囧 | 园豆:205 (菜鸟二级) | 2008-08-30 04:03
0
没有IE6没办法测试,IE7没有问题 应该是那个middle的宽度有问题,100%的话,如果加了margin就会出问题,试着定义middle的margin为0,或者减小一下middle的宽度,不行就再加个float,应该没有问题
丁学 | 园豆:18530 (专家六级) | 2008-08-30 09:13
0
哈哈,也有人出现了我以前一样头疼的问题哦 把 div#middle { width:100%; padding: 0px 160px 5px 160px; margin: 0px; background-color: silver; } 这个宽度弄下 width设置下,(应该可以弄好的) 或则是弄下margin:10px 0 0 1px;(距上,右,下,左多少像素,)
tertyufer | 园豆:35 (初学一级) | 2008-08-30 17:42
0
只看了图片,猜测: 父容器宽度不够,ff和ie解释的盒模型方式不一样
奇军 | 园豆:265 (菜鸟二级) | 2008-08-30 21:06
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册