ciao a tutti!
ho un problema che mi tiene bloccata da un po' e che non riesco a risolvere da sola...ho una semplice immagine che vorrei proporre come sfondo a tutta pagina per tutte le pagine di un sito. ho letto anche l' articolo http://css.html.it/articoli/leggi/31...a-con-i-css/2/ ma entrambe le soluzioni ivi proposte non hanno dato il risultato sperato, poichè l' immagine veniva sì impostata a tutta pagina ma sovrastava completamente TUTTO il contenuto della pagina in questione!
il sito è in aspx, ho seguito la teoria delle sezioni create grazie all' utilizzo dei soli div (quindi niente tabelle, come ero abituata a fare...).
----
ecco il codice html :
--
master page2 ::
<%@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage2.master.cs" Inherits="MasterPage2" MasterPageFile="~/MasterPage.master" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
<%--sezione dinamica della pagina (in relazione alla selezione dei vari link)--%>
<div id="div_variabile">
<asp:ContentPlaceHolder ID="ContentPlaceHolder2" runat="server">
</asp:ContentPlaceHolder>
</div>
<%--sezione del menu laterale--%>
<div class="map">
<asp:TreeView ID="TreeView1" runat="server" DataSourceID="SiteMapDataSource1"></asp:TreeView>
<asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" />
</div>
</asp:Content>
--
masterpage::
<%@ Master Language="C#" AutoEventWireup="true"
CodeFile="MasterPage.master.cs" Inherits="MasterPage"%>
<!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">
<!--[if lt IE 7]>
<script type="text/javascript" src="js/mootools.js"></script>
<script type="text/javascript" src="js/core.js"></script>
<![endif]-->
<title>titolo</title>
<link href="StyleSheet.css" rel="stylesheet" type="text/css" />
</head>
<body>
[img]images/forest.jpg[/img]
<form id="form1" runat="server">
<div>
<%--Titolo del sito--%>
<asp:Panel ID="pnlIntestazioneMaster" Width="100%" runat="server">
<div id="divheader">
<h1>titolo</h1>
<h2>sottotitolo</h2>
</div>
</asp:Panel>
<%--Path del sito--%>
<asp:Panel ID="pnlPath" Width="100%" runat="server">
<hr />
<asp:SiteMapPath ID="SiteMapPath1" runat="server" PathSeparator=" > " RenderCurrentNodeAsLink="true">
</asp:SiteMapPath>
<hr />
</asp:Panel>
<%--Sezione contenente il menù laterale e la sezione centrale (cfr. masterpage2)--%>
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div>
<div id="extraDiv1"><span></span></div>
<div id="extraDiv2"><span></span></div>
<div id="extraDiv3"><span></span></div>
<div id="extraDiv4"><span></span></div>
<div id="extraDiv5"><span></span></div>
<div id="extraDiv6"><span></span></div>
</form>
</body>
</html>
----
per il css, al momento ho fatto qst :
--
img.bg {
/* regole per riempire la pagina con lo sfondo prescelto */
min-height: 100%;
min-width: 1024px;
/* regole per ridimensionare l'immagine proporzionalmente */
width: 100%;
height: auto;
/* posizonamento dello sfondo */
position: fixed;
top: 0;
left: 0;
}
@media screen and (max-width: 1024px){
img.bg {
left: 50%;
margin-left: -512px; }
}
div#content {
/* regola importante per mostrare il contenuto sopra lo sfondo */
position: relative;
/* formattazione del div, non ha effetti sullo sfondo */
width: 500px;
margin: 0 auto;
background: #fff;
padding: 20px;
font-family: helvetica, arial, sans-serif;
font-size: 10pt;
line-height: 16pt;
-moz-box-shadow: #000 4px 4px 10px;
-webkit-box-shadow: #000 4px 4px 10px;
}
nb: il css è esattamente qll riportato nell' articolo che ho citato prima ma non mi funziona.
qualcuno saprebbe dirmi il perchè?
grazie in anticipo e scusate la lunghezza della domanda ma non sapevo come spiegarmi al meglio.
Rispondi quotando