2010年5月4日 星期二

[CSS]相容IE與FireFox的對齊置中CSS寫法

IE與FireFox(FF)在CSS的屬性值上有著許多差異, 例如:center與-moz-center

以下是整理網路上的討論並測試出的兩個做法:
<html>
<head>
    <style>
        .container
        {
            text-align: center;
            border: solid 1px blue;
        }
        .container
        {
            text-align: -moz-center;
            border: solid 1px blue;
        }
    </style>
</head>
<body>
    <div class="container">
        <table>
            <tr>
                <td>
                    Text
                </td>
            </tr>
        </table>
        <div>
</body>
</html>
寫一個項目，但IE的屬性要加上#符號(有人測試加^ ~ @ # $ % ^ & * ( ) _ +都可以)，且IE的屬性要放在FF的屬性之後：<html> 
<head>
    <style>
        .container
        {
            text-align: -moz-center; 
            #text-align:center;
            border:solid1pxblue;
        }
    </style>
</head>
<body>
    <div class="container">
        <table>
            <tr>
                <td>
                    Text
                </td>
            </tr>
        </table>
        <div>
</body>
</html>
於
標籤： ,

沒有留言:

張貼留言

訂閱： 張貼留言 (Atom)