1

我在 Firefox 中创建了几个页面，一切看起来都正常。快速切换到 Chrome 和 Safari，并注意到我在此页面标题中的选择加入表单没有按应有的方式显示。我希望整个选择加入的 div 都在标题 div 内。据我所知，它位于 Firefox 的标题 div 中，但几乎所有其他浏览器都会在主导航下方显示它。

这是标题的 CSS 和应该在其中的选择加入表单：

.header{height: 302px;min-width: 100%; background-color: #265f8b;
    margin: 0 auto;}

.opt-in {height: 280px; width: 800px;background-color: #c7e877;float: right;
    margin-right: 200px;margin-top: 10px;border:5px solid #8db530;
    border-radius: 10px;position: relative;}

这是HTML：

<div class='header'>
<img style='border: 1px solid black;' src='images/main-logo.jpg'></img>
<div class='opt-in'>


    <p>Enter your name and email below to get 
        <span style='font-weight: bolder;'>Free Instant Access</span> to the most comprehensive 
        guide available on how to ..</p>

        <p><span style='font-weight: bolder;'>Over 10,000 people</span> have enjoyed my eBook and receive  
            a weekly newsletter with exclusive tips!</p>

        <table>
            <form method='post' action='opt-in-form.php'>
            <tr><td><input type='text' name='name' value='Enter Name...' /></td></tr>
            <tr><td><input type='text' name='email' value='Enter Your Email...' /></td></tr>
        <input class='opt-in-button' type='image' src='images/opt-in-button.png' alt='Submit Form' />
        </table>    

        </form>


    <img class='book-cover' src="images/book-cover-new.png"></img>

</div>

</div>

你会注意到我已经将它包含在标题 div 中，并且上面有一个浮点数。

http://fairchildwebsolutions.com/packattack/index.php

4

2 回答 2

3

将徽标 img 向左浮动。

float:left

还要为 img 元素指定一个宽度。width:auto也会做。

于 2013-10-03T14:34:45.190 回答
3

左上角的标志需要一个float: left. 那应该可以解决问题。

于 2013-10-03T14:33:04.603 回答