-1

我的页面在 Chrome 和 Firefox 中运行良好，但在 IE 中没有很好地解码。我修复了大多数错误，但我有一个似乎可以解决的错误。当前显示图片，并且

都挤在它旁边；该表显示正常。这是代码：

<div id="page">
            <div id="slider">
                <!-- Here is where the pictures for the slider go -->
                <div id="PhotoSlider">
                    <ul class="bjqs">
                        <li><img src="images/test2.png"></img></li>
                        <li><img src="images/test1.png"></img></li>                        
                    </ul>
                </div>
            <!-- Java Script for the slider -->
            <script>                 
                $("#PhotoSlider").bjqs({
                    'height' : 286,
                    'width' : 1000,
                    'animationDuration' : 800,
                    'showMarkers' : true,
                    'useCaptions' : false,
                    'keyboardNav' : false,
                    'showControls' : false
                });
            </script>
            </div>
            <div id="content">
                <div class="box">
                    <h1>Welcome!</h1><br/>
                        <p></p>
                        <p></p>
                </div>  
            </div>  

            <div id="contentRight">
                <p></p>
                <p></p>
            </div>
            <!-- This is the newsletter form -->
            <div id="sidebar">
                <img align="left" src="images/kidsSmiling1.png"></img><br>
                <h2>Newsletter</h2>
                <p>Sign up to receive the lastest news and special offers</p>
                <table>             
                    <tr>
                        <td>First Name<req>*</req>&nbsp;</td>
                        <td><input id="firstName" name="firstName" type="text" style="width:180"/>
                    </tr>
                    <tr>
                        <td>Last Name<req>*</req>&nbsp;</td>
                        <td><input id="lastName" name="lastName" type="text" style="width:180"/>
                    </tr>
                    <tr>
                        <td>Email<req>*</req>&nbsp;</td>
                        <td><input id="email" name="email" type="text" style="width:180"/>
                    </tr>
                </table>
                <p align="middle"><input align="middle" type="submit" value="Submit" onclick="save()"  style="width:65"></P>
                <p><req>*</req>&nbsp;Required fields</p>                
            </div>
            <br class="clearfix" />
            <!-- Social media div -->
            <div id="media">
                <img align="right" src="images/facebookLogo.png"></img> <img align="right" src="images/twitterLogo.png"></img>
            </div> 
        </div>
    </div>
    <!-- Footer -->
    <div id="footer">
        Copyright &copy; 2012 Kaysville Dental | <a href="mailto:ToothDocPaul@msn.com?Subject=Customer Inquiry">Email Us</a> | Phone:(800) 376-2241 | 690 Main Street. Kaysville, Utah
    </div>

我希望我有这个网站，以便你们可以看到，但不幸的是它只是在本地主机上......问题出在下面的图像和文本上。由于某种原因，图像被显示并且文本都在左侧，而不是在它自己的段落中。这是该部分的CSS：

#sidebar {
background: white;
padding: 0px 5px 0px 50px;
margin-left: 0;
border-right: 1px solid #C0C0C0 ;
float: left;
width: 312px;
}


#sidebar p {
font-size: 12px;
margin-bottom: 0.5em
}

#sidebar img{
margin-bottom: 1.5em;
}
#sidebar req {
font-size: 12px;
color: red;
}

#sidebar td{
padding: 0px 0px 10px 0px;
font-size: 14px;
}

#sidebar h2{
text-transform: uppercase;
}

#contentRight {
background: white;
padding: 0px 50px 0px 0px;
float: right;
width: 550px;
}

The last "contentRight" is the div that goes on the other side of the sidebar(to the right) so basically you have the side bar with a picture and a little form underneath and then to the right there is a section with just text

4

2 回答 2

0

You are missing td closing tags on the second cell of each row and also get rid of align="left" on the img tag

see http://jsfiddle.net/Y9yf8/1/

于 2012-06-20T20:08:57.967 回答
0

Try to assign float: left to the <img> tag and then float: left; width: 100%; to the <h2> tag...

Proof: http://jsfiddle.net/Y9yf8/3/ =)

P.S. or do as Huangism said...

于 2012-06-20T20:10:31.560 回答