PDA

View Full Version : unwanted border in FF

blbraner
08-25-2009, 06:58 AM
Hello-
Please excuse me if this has been asked before, I searched and searched but all I could find is people using tables, and as I am using Divs they don't apply.
But anyways I am new to asp.net and the way I learn best is by diving head first into a project. 20 min in I am stuck lol. I have tried playing around with border collapse and looked at datagride. If someone could point me in the right direction that would be great.



So I have a page I am developing and when I test it in IE7 there is no top border and it looks fine, in FF 3 however, it shows about a 1 inch white bored before any of my divs.
Here is my html

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Untitled Page</title>
<link href="StyleSheet.css" rel="stylesheet" type="text/css" />
</head>
<body>
<form id="form1" runat="server">
<div id="container">
<div id="header" style="top: auto">
<p> FitBlog</p>
<div id="buttons">
<asp:Button ID="Home" runat="server" Text="Home" CssClass="buttonStyle" />
<asp:Button ID="Articles" runat="server" Text="Articles"
CssClass="buttonStyle" />
<asp:Button ID="Store0" runat="server" Text="Store" CssClass="buttonStyle" />
</div>
</div>

<br />

<br />
<div id="featuredproducts">
<asp:AdRotator ID="AdRotator1" runat="server" DataSourceID="ads" />
<asp:XmlDataSource ID="ads" runat="server" DataFile="~/ads.xml">
</asp:XmlDataSource>
</div>
</div>
</form>
</body>
</html>


Here is my style sheet

#container { width: 1000px; margin: 0 auto; background-color: #fff; border-style:solid; border-width:2px; border-color:#a2a2a2;}
#header{ width: 1000px; height:90px;margin-top:auto; margin-bottom:auto; margin-left:auto; margin-right:auto; border-collapse:collapse; background: #fff url(http://xij23w.bay.livefilestore.com/y1pcbXBXBCJEk7hZ-ltYy_Hqa-xFrUJCUp7RQRgSFs_s_10DL_sKTxN7vAHMttJ2c9uEXL4uxc5mo4FIzwuJiaRzDao4aE4f4hM/background.gif);
}
#header p { font-size: 2.2em; color: #fff; margin-left: Auto; background: transparent; margin-top: auto; line-height: 1.5em;
height: 38px;
width: 107px;
float: left;
}
#buttons{ width: 600px; height:32px;
margin-left:auto; margin-top: 58px;
background: #fff url(http://xij23w.bay.livefilestore.com/y1pY1Rftpd9KYfIi3QaXDO_Xx6rc-yTBP4lBz2NMgYvHLPTGD6UWLGQPe7JAeNOlZubu3WwewfGxXfz7AQyRhweeQ/button25.gif);
}
#featuredproducts { width: 250px; height:250px; margin-left:500px; margin-top: 50px; background-color: #fff;}

.buttonStyle{
color:#a2a2a2;
font-family:verdana;
font-size:84%;
font-weight:bold;
background-color:#ffffff;
height:17px;
width:70px;
margin-top:13px;
margin-left:18px;
border-style:dashed;
border-width:1px;

}
abduraooft
08-25-2009, 09:09 AM
Could you post a link to your page?

PS: Please use ][/COLOR] tags to wrap your code while posting here. You may edit your above post.
blbraner
08-25-2009, 08:04 PM
I was going to ask about that [code] as well, but the site isnt actually hosted or avaiable on the internet as of yet as I just started working on it. I could take some screenshots and post them up if that would help?
blbraner
08-26-2009, 01:43 AM
so i figured out a "work around. turns out whats not my header but a div i had contained inside my header div

<div id="header" style="top: auto">
<p> FitBlog</p>
<div id="buttons">
<asp:Button ID="Home" runat="server" Text="Home" CssClass="buttonStyle" />
<asp:Button ID="Articles" runat="server" Text="Articles"
CssClass="buttonStyle" />
<asp:Button ID="Store0" runat="server" Text="Store" CssClass="buttonStyle" />
</div>
</div>


at it lined up perfect inside of ie but not so well in ff so i substituted by giving it a negative margin


<div id="header" style="top: auto">
<p>FitBlog</p>
</div>
<div id="buttons">
<asp:Button ID="Home" runat="server" Text="Home" CssClass="buttonStyle" />
<asp:Button ID="Articles" runat="server" Text="Articles"
CssClass="buttonStyle" />
<asp:Button ID="Store0" runat="server" Text="Store" CssClass="buttonStyle" />

</div>


***-32 top margin

#buttons{ width: 600px; height:32px;
margin:-32px 0 auto auto ;
background: #fff url(http://xij23w.bay.livefilestore.com/y1pY1Rftpd9KYfIi3QaXDO_Xx6rc-yTBP4lBz2NMgYvHLPTGD6UWLGQPe7JAeNOlZubu3WwewfGxXfz7AQyRhweeQ/button25.gif);
}


i realize this is not the most professional way to solve my issue but it is a start, if anyone has any other ideas please let me know
drhowarddrfine
08-28-2009, 05:42 PM
Most of us don't use asp so the generated markup is what's needed to help you. Also, what IE does makes no difference until you can get it working in a more modern browser. Then we can hack it to get it to work in IE.