Question

我有一个MVC2应用程序测试应用程序。母版页代码的结构如下：

<div id="mainContainer"> 
    <asp:ContentPlaceHolder ID="leftColPlaceHolder" runat="server"> 
        <div id="leftcolumn"> 
            <div class="links"> 
                <div class="padding_left"> 
                    blah blah 
                </div> 
            </div> 
            <div class="innertube"> 
              blah blah 
            </div> 
        </div> 
    </asp:ContentPlaceHolder> 
    <asp:ContentPlaceHolder ID="MainContent" runat="server"> 
        <div id="contentwrapper"> 
            <div id="contentcolumn"> 
               blah blah                </div> 
        </div> 
    </asp:ContentPlaceHolder> 
</div>

在视图index.aspx中，代码

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server"> 
<h2><%: ViewData["Message"] %></h2> 
<p> 
    To learn more about ASP.NET MVC visit <a href="http://asp.net/mvc" title="ASP.NET MVC Website">http://asp.net/mvc</a>. 
</p>

我想要留下h2部分填充，但它根本不起作用。请看我的CSS：

#maincontainer{
width: 840px; /*Width of main container*/
margin: 0 auto; /*Center container on page*/
}

#topsection{
background: #EAEAEA;
height: 90px; /*Height of top section*/
}

#topsection h1{
margin: 0;
padding-top: 15px;
}

#contentwrapper{
float: left;
width: 100%;
}

#contentcolumn{
margin-left: 300px; /*Set left margin to LeftColumnWidth*/
}

#leftcolumn
{
    float: left;
    width: 300px; /*Width of left column*/
    background: #C8FC98;
}

#footer
{
    clear: left;
    width: 100%;
    background: #666699;
    color: #FFF;
    text-align: center;
    padding: 4px 0;
 }

  #footer a{
  color: #FFFF80;
  }

  .innertube{
  /*Margins for inner DIV inside each column (to provide padding)*/
    margin-top: 0;
   }

  .links
  {
      width: 300px;
      height: 541px; /* must be 541px to display full image */
      background-image: url('../../cross.jpg');
  } 

  h2
  {
      padding-left: 55px;
      background-color: #00FFFF;
  }

由于

Answer 1

我复制了样式并创建了一个HTML文件：

<h2><%: ViewData["Message"] %></h2> <p> To learn more about ASP.NET MVC visit <a href="http://asp.net/mvc" title="ASP.NET MVC Website">http://asp.net/mvc</a>. </p>

似乎工作正常。如果您使用的是Chrome或Firefox，请尝试右键单击文本并检查元素以检查是否采用了该样式。可能是您有不同类的几种h2样式。通过更改css属性并跟踪页面上的更改来找到正确的h2。当你找到合适的一个时，去同一行的css文件来纠正风格。

作为一种非常快速的解决方案（虽然不是一种好的做法），您可以将h2标签更改为：

<h2 style="padding-left: 55px;"></h2>

希望这有帮助。

Answer 2

填充工作正常。我打算附上一个屏幕截图，但没有足够的声誉点。使用填充左侧，您将看到文本缩进55px，蓝色背景将从0开始。

如果你想要整个h2区域缩进，那么你应该使用margin-left：55px;

我希望这有帮助！

填充左边不起作用

2 个答案: