CSS Forum

**spiralfive** · 05:21 PM

I just got through with my first (valid) HTML 4.01 site, using all CSS. Problem is, it only looks right in Safari. Unfortunately, that's all I have to test it in. Could someone tell me whats wrong? Users say that the logo continues over the right border.

http://www.blognation.info/
http://www.blognation.info/wp-inst/w...e/simplebn.css

PS: Also, check out the site (free wordpress blogs) if interested.

[edit:] Also, could someone tell me if the hover effect (on the login/sign-up bar) works in any othe browsers? I know it works in Safari, and doesn't work in IE, but that's all I have to test it in.

**jyoz22** · 02-27-2006, 07:44 PM

I've noticed 1 error on your page --

simple -- just move <div style="text-align: center;" id="container"> after the...

<div style="text-align: center;"><a href="http://www.blognation.info/"><img style="border: 0px solid ; width: 700px; height: 110px;" alt="BlogNation.info - Free Wordpress Blogs" src="http://www.outhost.org/bn/opr41s.gif"></a></div>

tag.

And yes the mouseover does work for FireFox 1.5

**spiralfive** · 02-27-2006, 08:53 PM

Allright, changed that and the logo appeared correctly. But, the content is stil aligned to the left. I changed it to an absolute value, could someone tell me if everything is aligned correctly?

Oh yeah, and thanks for your help, jyoz22.

**jyoz22** · 02-28-2006, 01:26 PM

whoops.

It works correctly on Firefox but not IE.
here's how to fix it.

1. Remove the <div> that is the "container" (<div style="text-align: center;" id="container">)
2. Modify the <div> for the image to this...
<center><div style="text-align: center; width:700px; align:center;">

this worked for my IE & Firefox

**spiralfive** · 03-01-2006, 10:19 AM

I'm not sure what you meant to do, but I changed it and it still isn't centered in IE...

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <meta content="text/html; charset=utf-8"
 http-equiv="content-type">
  <title>BlogNation.info - Free Wordpress Blogs</title>
  <link href="http://www.blognation.info/wp-inst/wp-content/themes/home/simplebn.css" rel="stylesheet" type="text/css" />  
  </head>
<body style="color: rgb(0, 0, 0);" link="#0000ee"
 alink="#ee0000" vlink="#551a8b">
<table
 style="width: 620px; text-align: left; margin-left: auto; margin-right: auto;"
 border="0" cellpadding="0" cellspacing="0">
  <tbody>
    <tr>
      <td>
<center><div style="text-align: center; align:center; width : 720px;"><a
 href="http://www.blognation.info/"><img
 style="border: 0px solid ; width: 700px; height: 110px;"
 alt="BlogNation.info - Free Wordpress Blogs"
 src="http://www.outhost.org/bn/opr41s.gif"></a></div>
<p style="text-align: center; background-color: rgb(204, 255, 255);"
 class="cells">BlogNation.info is a free blogs host,
providing it's users with Wordpress Blogs. Wordpress is state-of the
art publishing platform licensed under the GPL Open-Source license. We
provide you with a free blog at "blognation.info/username" for you to
post your ideas, interests, news, and any other information (legal).
All users also get access to our vast library of customizable themes,
RSS Feeds, and more. BlogNation.info also provides free support at our
parent site, Outhost.org. We can help you build traffic to your blog,
give you technical support, and more. Live support is also a planned
support method currently being implemented at Outhost.org. As always,
100% free with no restrictions. </p>
<div style="text-align: center;" id="grayrain">
<h4><big><a href="http://www.outhost.org/bn-tos.html">Get
a Free Wordpress Blog</a> | </big><big><a
 href="http://www.blognation.info/wp-login.php">Login to Your
Blog</a> | <a href="http://spiralfive.miyahost.com/">Live Help</a></big></h4>
</div>
<h3 style="text-align: left;">BlogNation.info
&nbsp;Features</h3>
<p style="text-align: left;" class="cells">- Ajax
Administration
Inferface allows you to quickly update your blog without reloading the
page<br>
- Able to have Multiple Writers from the BlogNation.info Community<br>
- 60 Easily Customizable themes adapted to BlogNation.info<br>
- RSS Feed for your blog, so your users can stay up to date without
visiting your site<br>
- Non-Intrusive banner ads that match your blog's content and design
100%<br>
- Totally Standards Compliant HTML and CSS on all themes
<br>
- A demo blog is available <a
 href="http://www.blognation.info/spiralfive">here</a>,
using one of our 60+ themes<span style="text-decoration: underline;"><br>
</span><a href="http://www.freedegreeinfo.be/"></a>
</p>
<h3 style="text-align: left;">Reporting Content</h3>
<p style="text-align: left;" class="cells">
If you find a BN (BlogNation.info) user posting questionable content,
including warez, adult content, excessive racial slurs, link farms,
illegal products, copyrighted content, and otherwise illegal or
objectable content, please report the content by visiting Outhost.org
and using the LiveHelp, PM, or New Topic features to let an
Administrator know. Please include the complete URL to the blog, and
what was posted.</p>
<SCRIPT language="JavaScript1.1" type="text/javascript" src="http://context5.kanoodle.com/cgi-bin/ctpub_adserv.cgi?id=85418814&site_id=86515105&format=600x400b&bdcl=ffffff&bgcl=FFFFFF&tlcl=0606FF&ttcl=660033&ulcl=0066ff"></SCRIPT>
<?php
if(function_exists('fimii_wpmu_last_updated'))
{
fimii_wpmu_last_updated();
}
?>
<p class="copyright">2006 BlogNation.info. All
Rights
Reserved. BN Blogs are powered by Wordpress. - BN v.0.1.9</p>
<h3 style="text-align: left;">
</h3>
<div align="center">
<p style="text-align: center; background-color: rgb(204, 255, 255);"
 class="codehere"><a href="http://www.thefreesite.com/">The
Free Site</a> | <a href="http://www.hotscripts.com/">Hot
Scripts</a> | <a href="http://www.scripts.com/">Scripts.com</a>
|
<a href="http://www.cgiscript-directory.com/">CGI Scripts</a>
| <a href="http://www.freestuffchannel.com/">Free Stuff
Channel</a> | <a href="http://www.freebiedirectory.com">Freebie
Directory</a> | <a href="http://www.scriptsearch.com/">ScriptSearch</a></center>
</p>
</div>
</div>
</td>
    </tr>
  </tbody>
</table>
</body>
</html>

**jyoz22** · 03-01-2006, 03:44 PM

TRY THIS....

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta content="text/html; charset=utf-8"
http-equiv="content-type">
<title>BlogNation.info - Free Wordpress Blogs</title>
<link href="http://www.blognation.info/wp-inst/wp-content/themes/home/simplebn.css" rel="stylesheet" type="text/css" />
</head>
<body style="color: rgb(0, 0, 0);" link="#0000ee"
alink="#ee0000" vlink="#551a8b">
<table
style="width: 620px; text-align: left; margin-left: auto; margin-right: auto;"
border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td>
<center><div style="text-align: center; align:center; width : 720px;"><a
href="http://www.blognation.info/"><img
style="border: 0px solid ; width: 700px; height: 110px;"
alt="BlogNation.info - Free Wordpress Blogs"
src="http://www.outhost.org/bn/opr41s.gif"></a>
<p style="text-align: center; background-color: rgb(204, 255, 255);"
class="cells">BlogNation.info is a free blogs host,
providing it's users with Wordpress Blogs. Wordpress is state-of the
art publishing platform licensed under the GPL Open-Source license. We
provide you with a free blog at "blognation.info/username" for you to
post your ideas, interests, news, and any other information (legal).
All users also get access to our vast library of customizable themes,
RSS Feeds, and more. BlogNation.info also provides free support at our
parent site, Outhost.org. We can help you build traffic to your blog,
give you technical support, and more. Live support is also a planned
support method currently being implemented at Outhost.org. As always,
100% free with no restrictions. </p>
<div style="text-align: center;" id="grayrain">
<h4><big><a href="http://www.outhost.org/bn-tos.html">Get
a Free Wordpress Blog</a> | </big><big><a
href="http://www.blognation.info/wp-login.php">Login to Your
Blog</a> | <a href="http://spiralfive.miyahost.com/">Live Help</a></big></h4>
</div>
<h3 style="text-align: left;">BlogNation.info
 Features</h3>
<p style="text-align: left;" class="cells">- Ajax
Administration
Inferface allows you to quickly update your blog without reloading the
page<br>
- Able to have Multiple Writers from the BlogNation.info Community<br>
- 60 Easily Customizable themes adapted to BlogNation.info<br>
- RSS Feed for your blog, so your users can stay up to date without
visiting your site<br>
- Non-Intrusive banner ads that match your blog's content and design
100%<br>
- Totally Standards Compliant HTML and CSS on all themes
<br>
- A demo blog is available <a
href="http://www.blognation.info/spiralfive">here</a>,
using one of our 60+ themes<span style="text-decoration: underline;"><br>
</span><a href="http://www.freedegreeinfo.be/"></a>
</p>
<h3 style="text-align: left;">Reporting Content</h3>
<p style="text-align: left;" class="cells">
If you find a BN (BlogNation.info) user posting questionable content,
including warez, adult content, excessive racial slurs, link farms,
illegal products, copyrighted content, and otherwise illegal or
objectable content, please report the content by visiting Outhost.org
and using the LiveHelp, PM, or New Topic features to let an
Administrator know. Please include the complete URL to the blog, and
what was posted.</p>
<SCRIPT language="JavaScript1.1" type="text/javascript" src="http://context5.kanoodle.com/cgi-bin/ctpub_adserv.cgi?id=85418814&site_id=86515105&form at=600x400b&bdcl=ffffff&bgcl=FFFFFF&tlcl=0606FF&tt cl=660033&ulcl=0066ff"></SCRIPT>
<?php
if(function_exists('fimii_wpmu_last_updated'))
{
fimii_wpmu_last_updated();
}
?>
<p class="copyright">2006 BlogNation.info. All
Rights
Reserved. BN Blogs are powered by Wordpress. - BN v.0.1.9</p>
<h3 style="text-align: left;">
</h3>
<div align="center">
<p style="text-align: center; background-color: rgb(204, 255, 255);"
class="codehere"><a href="http://www.thefreesite.com/">The
Free Site</a> | <a href="http://www.hotscripts.com/">Hot
Scripts</a> | <a href="http://www.scripts.com/">Scripts.com</a>
|
<a href="http://www.cgiscript-directory.com/">CGI Scripts</a>
| <a href="http://www.freestuffchannel.com/">Free Stuff
Channel</a> | <a href="http://www.freebiedirectory.com">Freebie
Directory</a> | <a href="http://www.scriptsearch.com/">ScriptSearch</a></center>
</p>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</body>
</html>

**spiralfive** · 03-01-2006, 04:23 PM

Still aligned fine in Safari. Does it look right in Firefox and IE?

**jyoz22** · 03-01-2006, 08:04 PM

I attatched a file that works on my IE and FireFox.

**spiralfive** · 03-01-2006, 11:20 PM

Hooray!! It works in Internet Explorer and Firefox. I'll test it in Safari when I get back on my Mac (though i'm sure it works). Could an opera user tell me if the content is center aligned on BlogNation.info?

**vangogh** · 03-02-2006, 01:43 AM

It's all centered in Opera 8.5. The blue background wasnt' showing though.

**spiralfive** · 03-02-2006, 09:56 PM

"wasn't" as in is was not before I changed it to the new code, or it's not showing the background now?

Oh yeah, and thanks for your help jyoz22. If you'd like a credit on BlogNation.info for your assistance, let me know your site address (if you have one).

**vangogh** · 03-03-2006, 12:42 AM

I'm still not seeing the blue background in Opera. I just see a white background. Otherwise everything else is looking the same in Opera and Firefox.