Forum Moderators: not2easy

Message Too Old, No Replies

Div Positioning, Text Box

Firefox, good. Safari, bad.

         

botounami

2:53 am on Sep 18, 2010 (gmt 0)

10+ Year Member



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>

Major_Payne

3:30 am on Sep 18, 2010 (gmt 0)



You have used absolute positioning set at 50/50 so anytime you resize a browser's working window size, those will always try to stay at 50/50.

12 HTML errors [validator.w3.org]

This is not a proper XHTML doctype:

<html xmlns="http://www.w3.org/1999/xhtml">