div文本中不必要的換行符

當用戶按下注冊按鈕（葡萄牙語中的「Cadastrar」）時，我需要隱藏一個新聞通訊表單，並且這已經發生，因爲您可能會檢查我的website。但是，成功消息是通過不必要的換行符呈現的。爲什麼？div文本中不必要的換行符

我需要填充頁腳的整個高度（如果可能的話，不要固定子div的高度），但文本應該垂直居中在紅色框中。

您可能會發現通過訪問我的網站很容易檢查問題，填寫電子郵件地址字段並單擊下面的按鈕，但這裏是在那裏呈現的HTML。

<div id="mc4wp-form-1" class="form mc4wp-form mc4wp-form-3571 mc4wp-ajax mc4wp-form-success"> 
    <form method="post" lpformnum="1" _lpchecked="1"> 
     <input type="email" name="EMAIL" class="text" placeholder="Seu email" required=""> 
     <input type="submit" class="bt" value="Cadastrar"><span class="mc4wp-ajax-loader" style="display: none; vertical-align: middle; height: 16px; width: 16px; border: 0px; margin-left: 5px; background: url(/img/ajax-loader.gif) 50% 50% no-repeat;"></span> 
     <div style="position: absolute; left: -5000px;"> 
      <input type="text" name="_mc4wp_required_but_not_really" value="" tabindex="-1"> 
     </div> 
    </form> 
    <div class="mc4wp-response"> 
     <div class="mc4wp-alert mc4wp-success">Obrigado, seu cadastro foi efetuado com sucesso! Por favor verifique seu e-mail.</div> 
    </div> 
</div>

這裏是爲了重現上jsfiddle的嘗試。

來源

2015-09-14 Juliano Nunes Silva Oliveira

可能的解決方法添加float: left;屬性爲mc4wp-error選擇

.mc4wp-error { 
    background-color: #FEE7ED; 
    color: #F41952; 
    border-color: #F41952; 
    float: left; <----Add this 
}

之所以文本是打破

通訊，輸入和按鍵按下，打破文本

從刪除float:left

footer form { 
    width: 100% !important; 
    float: left !important; <---Remove this 
} 

.mc4wp-alert { 
    position: absolute; 
    top: 0px; 
    min-height: 200px; 
}

移動視圖和CSS改變max-width:480px

@media (max-width: 480px) { 
    footer form { 
     float: left !important; <---Remove this 
    } 

    .mc4wp-alert { 
     position: absolute; 
     top: inherit; 
     min-height: 200px; 
     bottom: -90px; 
    } 
}

來源

2015-09-14 13:50:55 Shehary

如果您填寫有效的電子郵件格式，它將不會使用此類，並將float：left添加到mc4wp-success使div位於表單下。 –

是的，它不是看起來不錯，在表格下方 – Shehary

這不是我的搭檔想要的。 –

如果更改：

.mc4wp-alert { 
    ... 
    ... 
    position: relative; 
}

到position: fixed;，你會發現這個空間實際上是由電子郵件文本框和按鈕佔據的。解決方案是使用position: absolute;。我在Chrome和IE11中測試過它。

來源

2015-09-14 14:12:09

div文本中不必要的換行符

回答

相關問題