6 replies [Last post]
sunzfan
Offline
newbie
Last seen: 11 years 10 weeks ago
Joined: 2008-09-06
Posts: 3
Points: 0

Hey all,

I'm having a small cross-browser problem that I can't figure out.

My site, holloblog.com, has a background image at the top of the page. It's supposed to line-up perfectly with the center TD (the blog) as you can see. If you load it up in Firefox, it's perfect. In IE, the background image seems 2 px to the right. What am I missing here? Thanks in advance to all who help...

Ed Seedhouse
Ed Seedhouse's picture
Offline
Guru
Victoria British Columbia
Last seen: 51 weeks 9 hours ago
Victoria British Columbia
Timezone: GMT-8
Joined: 2005-12-14
Posts: 3570
Points: 675

You have 38 html errors and

You have 38 html errors and seven CSS errors. If you want browsers to follow standards you have to give them code that conforms to the standard. If you don't then there is actually no standard for them to follow so you have no basis for a complaint.

You are using tables for layout, a practice that is ten years out of date. There's no need for a single table anywhere on that page.

First, learn to use a validator if you don't already know. How to do so is already explained on this very web site so I won't repeat it. Get your code validated and, preferably, lose the layout tables. Then if you have the same problem come on back and ask again.

If you must use a table for layout you'll have a harder time getting help at this site, because almost all of use have moved away from this outdated practice years ago. But there are still a few who will try.

Ed Seedhouse

Posting Guidelines

Watch out! I am carrying irony, sarcasm and satire, and know how to use them.

SidP7
Offline
Regular
Last seen: 11 years 10 weeks ago
Joined: 2008-06-19
Posts: 29
Points: 0

heh, well...let me see if

heh,

well...let me see if I can be a little more constructive.

http://www.holloblog.com/wp-content/themes/dreamplace/styleDay.css
 
body {
 
        background: #CAF1FF url(images/morning1.jpg) no-repeat;
 
        background-position: top center;
 
        background repeat: no-repeat;
 
	color: #333333;
 
	margin: 350px 0px 0px 0px;
 
	<span style="font-weight:bold">padding: 0px 0px 0px;</span>
 
}

I suspect the problem is in the last line. The padding should be:

padding: 0px 0px 0px 0px;

or you can just write:

padding: 0px;

which will initialize 0px padding on all sides.

I'm not sure if this will fix the problem, but give it a try and see what happens.

PS. Ed is right though. Using tables for formating your site is an outdated practice and you really should learn how to harness the power of CSS. That being said, you've obviously done a fair amount of work on your blog and shouldn't have to redo something just to conform to what professionals consider is the right way to do things. I would however fix the errors you are getting. It will ensure (hopefully) that your page renders correctly in future browsers as well.

sunzfan
Offline
newbie
Last seen: 11 years 10 weeks ago
Joined: 2008-09-06
Posts: 3
Points: 0

Joke

Ed Seedhouse wrote:

You have 38 html errors and seven CSS errors. If you want browsers to follow standards you have to give them code that conforms to the standard. If you don't then there is actually no standard for them to follow so you have no basis for a complaint.

You are using tables for layout, a practice that is ten years out of date. There's no need for a single table anywhere on that page.

First, learn to use a validator if you don't already know. How to do so is already explained on this very web site so I won't repeat it. Get your code validated and, preferably, lose the layout tables. Then if you have the same problem come on back and ask again.

If you must use a table for layout you'll have a harder time getting help at this site, because almost all of use have moved away from this outdated practice years ago. But there are still a few who will try.

Yeah, not especially helpful...more condescending.

If I wanted to know what a validator is, I wouldn't have cited a specific issue on my site. Wordpress apparently considers tables useful in some capacity, as their hard-coded into their defaults. I am aware of the issues they can cause but couldn't debug it. HENCE THE POST.

THANK YOU to the second poster who made a constructive effort. I'm truly appreciative and will give that a shot...

sunzfan
Offline
newbie
Last seen: 11 years 10 weeks ago
Joined: 2008-09-06
Posts: 3
Points: 0

Thought for sure that would

Thought for sure that would work, but no dice :-/ Thanks for the attempt though.

Ed Seedhouse
Ed Seedhouse's picture
Offline
Guru
Victoria British Columbia
Last seen: 51 weeks 9 hours ago
Victoria British Columbia
Timezone: GMT-8
Joined: 2005-12-14
Posts: 3570
Points: 675

sunzfan wrote: If I wanted

sunzfan wrote:

If I wanted to know what a validator is, I wouldn't have cited a specific issue on my site.

If you don't know what a validator is you will get nowhere designing web pages. No condescention was intended nor implied, merely a fact as any experienced designer on this site will affirm.

Quote:

Wordpress apparently considers tables useful in some capacity, as their hard-coded into their defaults.

Well actually the default built in wordpress theme doesn't use tables for layout at all. If yours does you have a badly designed theme and should get rid of it.

It's perfectly possible to have a valid wordpress site. I know, because I've done that.

Tables are greatly useful for marking up tabular content. But not for laying out a page.

Ed Seedhouse

Posting Guidelines

Watch out! I am carrying irony, sarcasm and satire, and know how to use them.

SidP7
Offline
Regular
Last seen: 11 years 10 weeks ago
Joined: 2008-06-19
Posts: 29
Points: 0

sunzfan wrote:Thought for

sunzfan wrote:

Thought for sure that would work, but no dice :-/ Thanks for the attempt though.

Try this:

background-position: top <span style="font-weight:bold">left</span>;

instead of

background-position: top center;

If your background has enough width, it should pull across to the right side. Try it and see what happens.