Hey guys. Thanks ahead of time for looking at my post.
I've got a very simple website and a very simple problem. The website is here:
[
befestival2010.com...]
If you'll notice, when it displays in Firefox it's fine. When it displays in Safari, the "news" box is too low. Also, the way that I've got it positioned it's trying to stay in the middle of the window even when I resize it. As you can tell I'm just getting my feet wet with programming and need a little boost from you guys!
I've made a fake div so the screen scrolls the entirety of the poster.
Here's the code:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Be Fest 2010</title>
<style type="text/css">
#conash3D0
{
display:none;
}
body
{
background-image:url(images/mainbg.png);
background-repeat:no-repeat;
background-position:center top;
}
div.textboxback
{
position:absolute;
top:50%;
left:50%;
margin-top: -90px;
margin-left: -150px;
height: 220px;
width:300px;
overflow: auto;
filter:alpha(opacity=50);
-moz-opacity:.50;
opacity:.50;
background:#FFFFCC;
border-color: #666666;
border-width: 2px;
border-style: solid;
}
div.textbox
{
position:absolute;
top:50%;
left:50%;
margin-top: -90px;
margin-left: -140px;
height: 220px;
width:290px;
overflow: auto;
background:transparent;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 12px;
font-weight: bold;
}
</style>
</head>
<body>
<div style="height:864px";></div>
<div class="textboxback"></div>
<div class="textbox">
<p>09.18.10 - Extra bands and info added. </p>
<p>09.17.10 - Be Fest website official launch.</p>
</div>
</body>
</html>