CSS funktioniert nicht in ASP.NET

Ich habe eine einfache Seite in HTML erstellt, die gut funktioniert. Aber wenn ich das nach ASP.NET importiere, verstopft das Seitendesign.CSS funktioniert nicht in ASP.NET

Hier ist meine Site.Master

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Site.master.cs" Inherits="Elite.WUI.Site" %> 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml" > 
<head runat="server"> 
    <title></title> 
    <link rel="stylesheet" type="text/css" href="styles.css" /> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <asp:ContentPlaceHolder ID="headerCPH" runat="server"> 
     <div id="header"> 
      <h1>WUI</h1> 
     </div> 
     <hr /> 
    </asp:ContentPlaceHolder> 
    <asp:ContentPlaceHolder ID="navigationCPH" runat="server"> 
     <div id="navigation"> 
      <ul> 
       <li>Home</li> 
       <li>Users</li> 
       <li>Campaigns</li> 
       <li>Settings</li> 
      </ul> 
     </div> 
    </asp:ContentPlaceHolder> 
    <asp:ContentPlaceHolder ID="contentCPH" runat="server"> 
    </asp:ContentPlaceHolder> 
    </form> 
</body> 
</html>

mein Sheet styles.css

#navigation 
{ 
    float: left; 
    border: 1pt solid; 
} 

#navigation ul 
{ 
    list-style-type: none; 
    padding: 5 5 5 5; 
    margin: 0; 
} 

#content 
{ 
    margin-left: 9%; 
    border: 1pt solid; 
    padding-left: 5; 
}

und die aktuelle Seite von Masterseite abgeleitet

<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="ABC.aspx.cs" Inherits="Elite.WUI.ABC" %> 
<asp:Content ID="Content3" ContentPlaceHolderID="contentCPH" runat="server"> 
    <div id="content"> 
     <p>Test content</p> 
    </div> 
</asp:Content>

Hier wird wie ich t wird in Firefox (Version 3.6) angezeigt

The margin property isn't working

Wie Sie, dass die Grenze, list-style-type-Eigenschaften arbeiten sehen, aber Marge nicht funktioniert. Kann mir jemand sagen, was mache ich falsch? Ich habe es in Google Chrome getestet, aber das gleiche Problem. Während HTML und CSS gut funktionieren, wenn es keine ASP.NET-Datei gibt, d. H. Einfache .html-Datei.

Quelle

2011-01-17 Tux

Haben Sie auf der Seite mit Firebug in Firefox oder dem Element Inspector in Chrome ausgesehen hat? Sehen Sie, was der abgeleitete CSS-Status ist, ich bin sicher, dass Sie in die richtige Richtung weisen werden. – Lazarus

Hinweis: Sehen Sie sich den Endcode an, indem Sie in Ihrem Browser eine "Quelle anzeigen" auswählen.Chancen sind die tatsächliche Markup unterscheidet sich von dem, was Sie erwarten, dass es ist. –

Ich habe beide es in Firebug und in der tatsächlichen Quelle (im Browser) angeschaut, aber ich habe nichts inkorrekt festgestellt :( – Tux

ändern

padding-left: 5;

padding-left: 5px;

und

padding: 5 5 5 5;

padding: 5px 5px 5px 5px;

Hinweis: zuletzt kann man auch schreiben: padding:5px;

Quelle

2011-01-17 08:55:27 Dan

OMG, die es getan haben :) So können wir schließen, dass ASP.NET Werte wi nicht verarbeitet Einheiten? – Tux

@Tux es ist nicht ASP.NET, dies ist ein Browserproblem. Ich verstehe nicht, wie es in Ihrer normalen HTML-Seite funktionierte. Sind Sie sicher, dass Sie keine Einheiten darin hatten? – Dan

Ja, ich habe es nochmals überprüft und es gibt keine Einheiten. – Tux

EDIT: Wie in den Kommentaren vorgeschlagen, dass ich die Quelle der statischen HTML-Datei und die generiert von ASP.NET überprüft und ich sah einige Unterschiede

Die CSS für <ul> in der ASP.NET-Quelle ist

div#navigation ul { 
list-style-type: none; 
margin: 0px; 
}

, und dass in der statischen Datei

#navigation ul { 
list-style-type: none; 
margin: 0px; 
padding: 5px; 
}

Man beachte den Unterschied der Polsterung (in t fehlt er ASP.NET Quelle)

Auch im Inhalt div gibt es die padding-left in der ASP.NET-Quelle fehlt. Aber AFAIK, das sollte nicht wichtig sein. Das Problem ist, dass nicht einmal die Margin-Eigenschaft auf das div angewendet wird.

PS: (. Es nicht zulassen, dass mir Bilder schreiben) Ich konnte die Frage nicht bearbeiten, weil ich nicht genug rep habe und jemand hat ein Bild in der Post hinzugefügt

Quelle

2011-01-17 08:52:24 Tux

CSS funktioniert nicht in ASP.NET

Antwort

Verwandte Themen