Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/85.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Html 带有浮动div的CSS跨浏览器问题_Html_Css - Fatal编程技术网

Html 带有浮动div的CSS跨浏览器问题

Html 带有浮动div的CSS跨浏览器问题,html,css,Html,Css,我已经在Firefox中创建了一些页面,一切看起来都是正常的。快速切换到Chrome和Safari,注意到我在页面标题中的选择加入表单没有按应有的方式显示。我希望整个opt-in div都在header div中。从Firefox的header div中可以看出,几乎所有其他浏览器都会在主导航下方显示它 以下是标题的CSS和其中应包含的选择加入表单: .header{height: 302px;min-width: 100%; background-color: #265f8b; mar

我已经在Firefox中创建了一些页面,一切看起来都是正常的。快速切换到Chrome和Safari,注意到我在页面标题中的选择加入表单没有按应有的方式显示。我希望整个opt-in div都在header div中。从Firefox的header 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>

在下面输入您的姓名和电子邮件以获取
免费即时访问最全面的
有关如何..的指南

超过10000人喜欢我的电子书并收到 每周一次的独家新闻简报

您会注意到,我已经将它包含在header div中,并且它上面有一个float


左上角的徽标需要一个
浮动:左
。这应该可以解决问题。

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

将徽标img向左浮动

float:left

还要为img元素指定宽度<代码>宽度:自动也可以。

将徽标img向左浮动

float:left

还要为img元素指定宽度<代码>宽度:自动也可以。

请在此处添加有意义的代码和问题描述。不要只链接到需要修复的站点——否则,一旦问题解决,这个问题将对未来的访问者失去任何价值。发布一个能证明你的问题的帖子会帮助你得到更好的答案。有关更多信息,请参阅“谢谢!”!请在此处添加有意义的代码和问题描述。不要只链接到需要修复的站点——否则,一旦问题解决,这个问题将对未来的访问者失去任何价值。发布一个能证明你的问题的帖子会帮助你得到更好的答案。有关更多信息,请参阅“谢谢!”!这正是我所说的。你的答案在我发布后就出现了。这是一个非常简单的问题,答案也很简单。这并不是说他偷了你的任何东西,这是一个显而易见的基本CSS修复。我并不是说他偷了我的答案。那不是指控。如果听起来像这样,我很抱歉:我只是说我们几乎在同一时间发布了相同的答案,这正是我所说的。啊,你的答案在我发布后出现了。这是一个非常简单的问题,答案也很简单。这并不是说他偷了你的任何东西,这是一个显而易见的基本CSS修复。我并不是说他偷了我的答案。那不是指控。如果听起来像这样,我很抱歉:DI只是说我们几乎在同一时间发布了相同的答案