0

我试图制作divwithbackground image和 with text message。当我制作width as 100%和时,一切都完美无缺height as auto。我使那个 div 高度是自动的,因为每当我增加font size of the text 那个 div 高度时,它也会动态增加。但是现在我的问题是,当我在 div 中留下空消息时,它不会显示任何消息,因为height:auto我想显示带有实际背景图像的 div 可显示。即使我将消息留空。是否可以显示具有自动高度的背景图像。

这是我的代码:

#loginContainer {
-moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background: url("http://s3.buysellads.com/1237708/176570-1371740695.gif") 
    no-repeat scroll center center #FF660D;  /*for example */
    border-color: #FFFFFF;
    border-image: none;
    border-right: medium solid #FFFFFF;
    border-style: none solid solid;
    border-width: medium;
    left: 0;
    margin-left: auto;
    margin-right: auto;
    position: fixed;
    right: 0;
    top: 0;
    vertical-align: super;
    width: 100%;
    z-index: 9999999;
}

这是小提琴

这是div 内有空消息的小提琴

4

5 回答 5

2

在下面添加一个最小高度div

#loginContainer {
    min-height: 200px;
}

工作样本

于 2013-09-06T12:52:43.273 回答
2

设置amin-height等于图像的高度。

于 2013-09-06T12:51:27.167 回答
1

设置min-height为#loginContainer

检查小提琴

http://jsfiddle.net/a39Va/12/

于 2013-09-06T12:53:57.950 回答
1

  如果没有内容,只需添加

 <div id="loginContainer">
&nbsp;
  <a class="" href="#"></a>
</div>
于 2013-09-06T12:55:07.640 回答
0

Min-height 在 IE6 中将失败。您可能需要考虑添加以下内容:

#loginContainer {
  min-height: 200px;
}
* html #loginContainer { 
  height:200px; 
}

由于 IE6 是唯一能够识别 '* html ....' 的浏览器,因此其他浏览器会忽略它。

除非你不关心IE6!(我希望这对我来说是可能的!)

于 2013-09-06T13:05:49.800 回答