私の人生では、適用しようとしている CSS が機能しない理由を理解できず、誰かが私を助けてくれることを願っています。
インデックスマスター
<%@ 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;
}