高度自动计算的高度不正确，所以背景不工作 - ASP.net 4.0 - 使用的主页 [英] Height auto - calculated height is incorrect so background is not working - ASP.net 4.0 - Master Page Used

问题描述

我想让自动高度。

我使用的是母版页，asp.net 4.0，css

这里的配置

p>

这里的css类

  * 
 {
 margin：0; 
 padding：0; 
} 
 
 .logo 
 {
 height：100px; 
 width：1000px; 
 position：absolute; 
 top：0px; 
} 
 
 body，html 
 {
 height：auto; 
 height：100％; 
} 
 
 .footer 
 {
 visibility：hidden; 
} 
 
 .MenuBarMasterPage 
 {
 position：absolute; 
 top：202px; 
 margin-left：auto; 
 margin-right：auto; 
 width：1000px; 
 height：40px; 
} 
 
 body 
 {
 background：＃0C0C0C url（http://static.monstermmorpg.com/images/backgrounds/animus-mix.gif）repeat ; 
 margin-right：auto; 
 margin-left：auto; 
 width：1000px; 
 background-position：top center; 
} 
 
 .main 
 {
 position：absolute; 
 top：242px; 
 width：1000px; 
 background：＃D1D1D1 url（http://static.monstermmorpg.com/images/backgrounds/content.png）repeat; 
 z-index：2; 
 height：auto; 
} 
  

根据firebug，main的计算风格高度为0px是问题

解决方案

为了避免必须在每个页面上手动设置不同的固定高度解决方案），您有两个选项：

• 使用JavaScript计算高度。


• t使用绝对定位。

没有理由对布局使用绝对定位。你应该从几乎所有的东西中删除 position：absolute ，并写下新的CSS。

你需要一个批次 float：left 和 float：right 。

I am trying to make height auto. Whatever i tried did not work until now.

I am using masterpage, asp.net 4.0 ,css

Here the config

Here the css classes

*
{
    margin: 0;
    padding: 0;
}

.logo
{
    height: 100px;
    width: 1000px;
    position: absolute;
    top: 0px;
}

body, html
{
    height: auto;
    height: 100%;
}

.footer
{
    visibility: hidden;
}

.MenuBarMasterPage
{
    position: absolute;
    top: 202px;
    margin-left: auto;
    margin-right: auto;
    width: 1000px;
    height: 40px;
}

body
{
    background: #0C0C0C url(http://static.monstermmorpg.com/images/backgrounds/animus-mix.gif) repeat;
    margin-right: auto;
    margin-left: auto;
    width: 1000px;
    background-position: top center;
}

.main
{
    position: absolute;
    top: 242px;
    width: 1000px;
    background: #D1D1D1 url(http://static.monstermmorpg.com/images/backgrounds/content.png) repeat;
    z-index: 2;
    height: auto;
}

According to the firebug the computed style height of main is 0px this is the problem

解决方案

To avoid having to manually set a different fixed height on each page (which is a terrible solution), you have two options:

• Use JavaScript to calculate the height.
• Don't use absolute positioning.

There is no reason to use absolute positioning for your layout. You should remove position: absolute from almost everything, and write new CSS.

You're going to need a lot of float: left and float: right.

这篇关于高度自动计算的高度不正确，所以背景不工作 - ASP.net 4.0 - 使用的主页的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！