【发布时间】：2013-06-13 05:27:43
【问题描述】：
对于我的生活，我无法弄清楚为什么我尝试应用的 CSS 不起作用，希望有人可以帮助我。
Index.Master
<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Index.master.cs" Inherits="IGS.Index" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<meta charset="utf-8" />
<link href="css/main.css" rel="stylesheet" type="text/css" />
<!--[if lte IE 7]>
<style>
.content { margin-right: -1px; }
ul.nav a { zoom: 1; }
</style>
<![endif]-->
<asp:ContentPlaceHolder ID="HeadContent" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form runat="server">
<div class="container">
<div class="header">
<asp:ContentPlaceHolder ID="HeaderContentBar" runat="server">
</asp:ContentPlaceHolder>
</div>
<div class="sidebar1">
<asp:ContentPlaceHolder ID="LeftNavBar" runat="server">
</asp:ContentPlaceHolder>
</div>
<div class="content">
<asp:ContentPlaceHolder ID="MainContentBar" runat="server">
</asp:ContentPlaceHolder>
</div>
<div class="footer">
<asp:ContentPlaceHolder ID="FooterContentBar" runat="server">
</asp:ContentPlaceHolder>
</div>
</div>
</form>
</body>
</html>
default.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="default.aspx.cs" Inherits="IGS._default"
MasterPageFile="Index.Master" %>
<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
<title>Site Index</title>
</asp:Content>
<asp:Content ID="HeaderContentBar" runat="server" ContentPlaceHolderID="HeaderContentBar">
Header
</asp:Content>
<asp:Content ID="LeftNavBar" runat="server" ContentPlaceHolderID="LeftNavBar">
<ul class="nav">
<li><a href="news.aspx">News</a></li>
<li><a href="admin/default.aspx">Administration</a></li>
</ul>
</asp:Content>
<asp:Content ID="MainContentBar" runat="server" ContentPlaceHolderID="MainContentBar">
<h1>
Latest News</h1>
<asp:Repeater ID="newsRepeater" runat="server">
<ItemTemplate>
<div class="newsHeadline">
<b>
<%# Server.HtmlEncode(Eval("newsHeadline").ToString())%></b>
<div class="newsStory">
<%# Server.HtmlEncode(Eval("newsStory").ToString())%>
</div>
<div class="newsFooter">
Posted By:
<asp:HyperLink ID="newsSubmittedBy" runat="server" NavigateUrl='<%# string.Format("User.aspx?id={0}", Eval("id")) %>'
Text='<%# Server.HtmlEncode(Eval("newsSubmittedBy").ToString())%>' />
- Submitted By:
<%# Server.HtmlEncode(Eval("newsDate").ToString())%>
</div>
<div style="text-align: right;">
<asp:HyperLink ID="newsReadMore" runat="server" CssClass="newsReadMore" NavigateUrl='<%# string.Format("News.aspx?id={0}", Eval("id")) %>'
Text="Read More..." />
</div>
<hr />
</ItemTemplate>
</asp:Repeater>
<p class="newsDaySelector">
<asp:TextBox ID="TextBox1" runat="server" Width="30" Text="7"></asp:TextBox>
days</p>
</asp:Content>
<asp:Content ID="FooterContentBar" runat="server" ContentPlaceHolderID="FooterContentBar">
</asp:Content>
编辑：多么不幸。我做了下面推荐的一切，但仍然无法正常工作。这很奇怪。该页面之前进行了部分样式设置，因此它似乎至少正确地抓住了它。如果其他人有任何想法，我很想听听。
这是我的 CSS。正如我所说，非常基本，它只工作了一半。主要问题是页脚不会沿着底部运行，而是与内容区域的左侧对齐。
body
{
font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
background-color: #42413C;
margin: 0;
padding: 0;
color: #000;
}
.container
{
width: 960px;
background-color: #FFF;
margin: 0 auto;
}
.header
{
background-color: #ADB96E;
}
.sidebar1
{
float: left;
width: 180px;
background-color: #EADCAE;
padding-bottom: 10px;
}
.content
{
padding: 10px 0;
width: 780px;
float: left;
}
.footer
{
padding: 10px 0;
background-color: #6F7D94;
position: relative;
clear: both;
}
【问题讨论】：
-
您的代码是正确的，做一件事清理解决方案并重新构建并再次检查，这可能对您有帮助
-
你确定你的css文件是正确的吗？如果它为您的文档中的某些部分设置样式，则可能是您拼错了一些 ids/classes。
-
我原以为这就是为什么我把所有东西都删掉了，除了最低限度，它仍然无法工作。这就是我现在关注的重点，因为其他所有内容似乎都已被淘汰。
-
如果您想要实现的是一个留在底部的页脚，请查看这篇文章：matthewjamestaylor.com/blog/… 听起来您的 css 已应用，但并没有像您想象的那样工作会工作的。