Ingen som vet?
Frågan#1
Jag har haft ett litet helvete till att skapa en sida där jag använder mig av ASP.NET för att jag har aldrig jobbat med sådant förut.
Hade uppskattat all hjälp eller tips jag kan få.
Jag har problem med min header där jag har rätt koordinater men fel bild visas ändå.
Här är bilden jag använder mig av:
http://img688.imageshack.us/img688/2843/spritemap.png
<!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 id="Head1" runat="server">
<title></title>
<asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>
<link rel="stylesheet" href="Static/Styles/AvanShop.css" type="text/css" media="screen"
title="no title" charset="utf-8" />
</head>
<body>
<form id="form1" runat="server">
<div id="wrapper" class="wrapper">
<div id="branding" class="branding">
<ul id="header">
<li id="avanhead"><a href="#"></a></li>
</ul>
</div>
<div id="meny" class="meny">
<ul id="avan-meny">
<li id="meny1"><a href="#Meny1">Meny1</a></li>
<li id="meny2"><a href="#Meny2">Meny2</a></li>
<li id="meny3"><a href="#Meny3">Meny3</a></li>
<li id="meny4"><a href="#Meny4">Meny4</a></li>
<li id="meny5"><a href="#Meny5">Meny5</a></li>
<li id="kundvagn"><a href="Kundvagn.aspx">Kundvagn</a></li>
</ul>
</div>
<div id="maincontent" class="main">
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div>
<div id="footer" class="footer">
<ul id="foot">
<li id="foot1"><a></a></li>
</ul>
</div>
</div>
</form>
</body>
</html>
css filen:
/* RESET */
html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset,input { margin: 0; padding: 0; }
h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,em,strong,th { font-size: 1em; font-weight: normal; font-style: normal; }
ul,ol { list-style: none; }
fieldset,img { border: none; }
caption,th { text-align: left; }
table { border-collapse: collapse; border-spacing: 0; }
#wrapper { margin: 0px auto; list-style: none; }
#wrapper li { display: inline; }
#wrapper li a { display: block; float: left; height: 450px; background-image: url(/Static/Images/spritemap.png); text-indent: -9999px;}
/******************************BANNER*****************************************/
#branding { width: 939px; height: 48px; margin: 0 auto; position: relative; }
#branding #header li { display: inline; }
#branding #header li a { float: left; height: 48px; display: block; text-indent: -9999px; }
#branding #header li#avanhead a {width: 939px; background-position: 0 -48px; }
/****************************************************************************/
/********************************MENU**************************************/
#meny { width: 939px; height: 29px; margin: 80px auto; position: relative; }
#meny #avan-meny li { display: inline; }
#meny #avan-meny li a { float: left; height: 29px; display: block; text-indent: -9999px}
#meny #avan-meny li#meny1 a { width: 148px; background-position: 0 -295px; }
#meny #avan-meny li#meny2 a { width: 159px; background-position: -148px -295px; }
#meny #avan-meny li#meny3 a { width: 161px; background-position: -308px -295px; }
#meny #avan-meny li#meny4 a { width: 160px; background-position: -468px -295px; }
#meny #avan-meny li#meny5 a { width: 160px; background-position: -628px -295px; }
#meny #avan-meny li#kundvagn a { width: 150px; background-position: -790px -295px; }
#meny #avan-meny li#meny1 a:hover { background-position: 0 -327px; }
#meny #avan-meny li#meny2 a:hover { background-position: -148px -327px; }
#meny #avan-meny li#meny3 a:hover { background-position: -308px -327px; }
#meny #avan-meny li#meny4 a:hover { background-position: -468px -327px; }
#meny #avan-meny li#meny5 a:hover { background-position: -628px -327px; }
#meny #avan-meny li#kundvagn a:hover { background-position: -790px -327px; }
#meny #avan-meny li#meny1 a:active, #meny #avan-meny li#meny1 a:focus { background-position: 0 -356px; }
#meny #avan-meny li#meny2 a:active, #meny #avan-meny li#meny2 a:focus { background-position: -149px -356px; }
#meny #avan-meny li#meny3 a:active, #meny #avan-meny li#meny3 a:focus { background-position: -308px -356px; }
#meny #avan-meny li#meny4 a:active, #meny #avan-meny li#meny4 a:focus { background-position: -468px -356px; }
#meny #avan-meny li#meny5 a:active, #meny #avan-meny li#meny5 a:focus { background-position: -628px -356px; }
#meny #avan-meny li#kundvagn a:active, #meny #avan-meny li#kundvagn a:focus { background-position: -790px -356px; }
/******************************************************************************************************************/
/*******************************FOOTER****************************************/
#footer { width: 939px; height: 29px; margin: 400px auto; position: relative; }
#footer #foot li { display: inline; }
#footer #foot li a { float: left; height: 29px; display: block; text-indent: -9999px}
#footer #foot li#foot1 a { width: 940px; background-position: 0 -228px; }
/******************************************************************************/
