我使用IP地址时IE中的JSP对齐问题

时间:2013-10-15 05:05:53

标签: jsp

我正在尝试创建一个页面,其中我正面临着对齐的问题。 Jsp页面在localhost中工作正常。 但是当我使用IP地址时,会出现一些对齐问题。

你能否帮我解决这个问题。

            <!DOCTYPE html>
            <html lang="en">
            <head>
            <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
            <title></title>
            <script src="<%=request.getContextPath() %>/TSStatic/javascript/jquery-1.7.1.min.js"></script>
            <script>
            $(window).on('load resize',function(){

                $('#col3').css({top:$('#col2').height()});
            });
            </script>

            <style type="text/css">
            html,body{height:100%;margin:0;padding:0}
            html>body{
                margin-left: auto ;
                margin-right: auto ;
                width: 984px;
                min-width: 953px;
                max-width: 1260px;

            }
            #col1{

                overflow:hidden;
                position:absolute;
                width:100%;
                top:136px;
                bottom:15px;


            }

            #col2{
                background-color:green;
                overflow:hidden;
                position:absolute;
                height : auto;
                width : 984px;

            }

            #col3{
                background-color :pink;
                overflow:auto;
                position:inherit;
                top : 0px;;
                bottom : 15px;
                width : 100%;
                float : left;
                clear : both;
                display: inline-block;
                }


            #top{
                position:absolute;
                left:0;
                width:984px;
                top:0px;
                height:136px;
                background:red;
                overflow:hidden;
            }
            #bottom{
                position:absolute;
                left:0;
                width:984px;
                height:30px;
                bottom:0;
                background:red;
                overflow:hidden;
            }
            #wrap{
                 height:100%;
                text-align:center;
                display:block;
                position:relative;
                margin: 0 auto;

                }
            </style>
            <!--[if lte IE 6 ]>
            <style type="text/css">

            * html {padding:330px 0 20px} 
            * html body{padding:330px 0 20px;padd\ing:0;}
            * html #col1,* html #col2, * html #col3{    
                height:100%;
                position:static;
                float:left;
            }
            * html #top, * html #bottom{
                clear:both;
                left:50%;
                margin-left:-380px;
            }
            * html #wrap{
                width:860px;
                margin:auto;
                position:relative;
                height:100%;
            }
            </style>
            <![endif]-->
            </head>
            <body>

            <div id="wrap">
            <div id="top">
                <h1>Header</h1>
            </div>
                <div id="col1">
                    <div id="col2">

                    </div>

                    <div id="col3">

                    </div>
                </div>



            <div id="bottom">
                Footer
            </div>

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

1 个答案:

答案 0 :(得分:0)