I posted something similar in the CSS forum, but now not sure if it is styling or how you use the ContentPage?
I have a very simple design, a header, a content, and a footer. The content is my contentpage. I am trying to style a contentpage so I have a left hand side and a right hand side. When I mess with the styling of the contentpage, however, it throws everything out of whack..I can simply make the left float:left, but then it takes it out of context of the contentpage. I try making the contentpage position:absolute, and that REALLY throws things in a huff.
Here are my files..any thoughts? If this is definetely CSS and has nothing to do with contentpage, I'll remove here (otherwise from the other). This is driving me bonkers!
Masterpage:
<%@ Master Language="
VB" CodeFile="MasterPage.master.
vb" 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">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Sun Bauer</title>
<link href="mainstyle.css" rel="stylesheet" type="text/css" />
<script language="javascript" type='text/javascript' >
function EvImageOverChange(name, direction)
{
switch(direction)
{
case 'in': name.src = 'Site_Images/' + name.id + 'Selecting.bmp';
break;
case 'out' : name.src = 'Site_Images/'+ name.id + 'white.bmp';
break;
case 'neither' : name.src = 'Site_Images/' + name.id + 'selected.bmp';
break;
}
}
</script>
</head>
<body>
<form id="form1" runat="server" accept="4">
<div id='main'>
<div id='header' >
<img src="Site_Images/Sunbanner.jpg" />
</div>
<div id='aboutbutton'>
<asp:ImageButton ID="AboutButton" runat="server" ImageUrl="Site_Images/ctl00_aboutbuttonwhite.bmp" PostBackUrl="default.aspx" />
</div>
<div id='exhibitbutton'>
<asp:ImageButton ID="ShowsButton" runat="server" ImageUrl="Site_Images/ctl00_showsbuttonwhite.bmp" PostBackUrl="shows.aspx" />
</div>
<div id='awardsbutton'>
<asp:ImageButton ID="AwardsButton" runat="server" ImageUrl="Site_Images/ctl00_awardsbuttonwhite.bmp" PostBackUrl="awards.aspx" />
</div>
<div id='artbutton'>
<asp:ImageButton ID="SunsartButton" runat="server" ImageUrl="Site_Images/ctl00_sunsartbuttonwhite.bmp" PostBackUrl="artgallery.aspx" />
</div>
<div id='container' style="position:absolute">
<asp:ContentPlaceHolder ID="ContentPlaceHolder2" runat="server">
</asp:ContentPlaceHolder>
</div>
<div id='footer'>
<asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl="Admin/addpictures.aspx">Login</asp:HyperLink>
<span style="margin-left:40px">Future Copyright Info</span>
</div>
</div>
</form>
</body>
</html>
ContentPage:
<%@ Page Language="
VB" MasterPageFile="~/MasterPage.master" AutoEventWireup="false" CodeFile="awards.aspx.
vb" Inherits="awards" title="Untitled Page" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder2" Runat="Server">
<div style="float:left; position:relative;">
<asp:Image ID="Image1" runat="server" ImageUrl="Site_Images/YosemiteFalls.jpg" Width="400px"/>
</div>
<div>
<asp:Image ID="Image2" runat="server" ImageUrl="Site_Images/YosemiteFalls.jpg" Width="100px"/>
</div>
<asp:ObjectDataSource ID="GetLocationsDataSource" runat="server" OldValuesParameterFormatString="original_{0}" SelectMethod="GetList" TypeName="Searing.SunArtSite.Bll.AwardsManager"></asp:ObjectDataSource>
</asp:Content>
CSS Page:
body {
font-family: sans-serif;
margin: 0;
margin-top:5px;
padding: 0;
background: url(site_images/back.jpg) center;
background-repeat: repeat-y;
}
h1, h6 {
margin: 0;
font-weight: normal;
}
div#main {
width:800px;
margin-left:auto;
margin-right:auto;
}
div#container {
border-left: 2px solid black;
border-right: 2px solid black;
border-bottom: 1px solid black;
}
div#header {
border: 2px solid black;
height:245px;
margin-bottom:5px;
}
div#footer
{
background:white;
border-bottom: 2px solid black;
border-left: 2px solid black;
border-right: 2px solid black;
border-top: 1px solid black;
padding:10px;
}
div#test {
font: arial;
}
div#aboutbutton {
border: 2px solid black;
float:left;
height:50px;
}
div#addpicturesbutton
{
border: 2px solid black;
float:left;
height:50px;
}
div#addshowbutton
{
border-top: 2px solid black;
border-bottom: 2px solid black;
float:left;
height:50px;
}
div#addawardsbutton
{
border: 2px solid black;
float:left;
height:50px;
}
div#exhibitbutton {
border-top: 2px solid black;
border-bottom: 2px solid black;
float:left;
height:50px;
}
div#awardsbutton {
border: 2px solid black;
float:left;
height:50px;
}
div#artbutton {
border-top: 2px solid black;
border-bottom: 2px solid black;
border-right: 2px solid black;
float:left;
height:50px;
}
div#sunpic
{
margin-top:10px;
margin-left:10px;
margin-right:10px;
border:2px solid black;
height:351px;
width:250px;
float:left;
}
div#abouttext
{
margin:10px;
font-family: sans-serif;
}
#login
{
background:white;
border-right:2px solid black;
}
ContentPage & CSS
