Cross browser inconsistency

See you again shortly with more problems. Zeldman

 

For once we agree zeldman. Him not having a doctype will bring inevitable errors.

~eric

 

I create a thread to get some help and all I get is criticism... thanks guys

 

Don't feel discouraged. It is constructive critisism. Just validate as the first step.

~eric

 

As scott showed, someone somewhere will always give you your quick fix. However, it was a very mean thing for him to do-- mean to you, and mean to your viewers. I'm surprised you cared how the site looked in Firefox at all. Why not just build for IE in Quirks Mode alone and be done with it?

What you did was you build a duct-tape and plywood vehicle and called it a car. Because it wasn't build correctly (nevermind that people can always argue over what "correct" means as far as the smaller details) it didn't run right and had no brakes. (we won't mention the total inability to steer)

You asked for help and were told to start over and build it right. You had put so much work into your ducttape-and-plywood car, and it looked like only one or two little things wrong with it, so you didn't want to follow that advice.

Scott came along and said, "add some more duct tape over here, and use a parachute to brake like they do at the races." Did it temporarily fix the problem? Yeah. BTW there are actually a few other rather large things going wrong with your car, but looking only with two browsers, you don't see them all. However you can't set which browser your visitors use so they will see the leaking oil and the uneven tire pressure and half-rusted-away steering column even if you missed it.

I understand not wanting to redo a bunch of work, and it IS your choice to continue struggling with what you've got.
However, do NOT get angry when you ask for free advice from professional mechanics who tell you, from their years of experience, that you're going waaay the wrong way, bad for your business and your safety and the safety of people unfortunate enough to be somewhere in your vicinity when you're driving around in that thing. No, no body HAS to go to your site and certainly the CSS and validation Nazi storm-troopers aren't going to break down your bedroom door in the middle of the night and drag you away to GCamp X-ray for indefinite time, BUT...

just because it's perfectly legal for obese seniors to walk around in string bikinis, not breaking the no-public-nudity laws in town, doesn't mean it's pretty, nice, or a Good Thing. It's in fact a terrible thing that needs to go away.

In any case, I hope I made it clear why you got the response you got. We work so hard to do the job right and professionally and someone comes along with this stuff, and tries calling it the same name... it's not. That's not a car, that's a pile of amalgamated parts that somehow, against physics, manages to move, slowly. That's not a website written in HTML-- that's a steaming pile of tag soup walking around pretending it's a web site (not like yours is the only one out there or anything, but you came to an HTML and CSS forum asking for what initially seemed like HTML or CSS help) and some of us feel a little offended by that (but oh well, we shouldn't be so thin-skinned I guess).

In any case, if you ever change your mind, or get around to redoing your site, come back and we will be here to lead you through the maze that is web building.

 

A car? You talk about the site asif it's some kind of lethal weapon. It's a small website. It can't and certainly won't kill any body, it's got no relation to a bodge job on a car. It's purpose is to provide information for potential clients - and it does just that! It doesn't hurt any body. In fact the only thing it harms is ego's, such as your own. I agree my methods of practice was wrong from the beginning - I should have coded it in valid html/css but i didn't.

I came to this form asking how I can fix those issues mentioned - not asking about common and recommended practices within web development.

Anyone else wishing to comment, it will be ignored. Good day.

 

Some want to be fed for a day. Some for a lifetime.

He'll be starving tomorrow.

 

These "recommendations" are not recommendations. They are the truth

~eric

 

Okay guys... I attempted a valid html/css version and I met problem after problem after problem.
Here is my attempt and these problems are the exact reason I didn't want to start all over again with valid script.
I have only uploaded two pages (home & windows) to show the variation of problems, Home has lots of text, windows has a small paragraph.

As you can see, it's VERY messy. Here are the issuses I have broken down - if anybody can help?

1. There's a space between the navigation bar and the header image of a few pixels that shouldn't be there.
2. I can't make the right and left content div's remain the same height as each other.
3. I can't stop the right footer image from hiding behind the enquiry box.
   
   Firefox Specific
4. The background image for the allcontent div doesn't show
5. The 'specialist' button doesn't appear (this has completely thrown me!)

 

I've also, opened a new thread for these issues, as they aren't specifically related to this original thread. It's here

 

Oh wow I feel so bad for you. This xhtml for this is not valid. I'll tidy this up a bit. You should be using 4.01 strict. Here is the source. This works in Firefox. Haven't tested in other browsers. This code is valid. Btw, one error with your code is that you were using tables. In your css you need to do this. Specify in #contenttext

background-color: white;

Code (markup):

Ok after you have done that then you need to update your page site. Here is the valid html code.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head><title>title</title>
<base href="http://www.pheel.co.uk/v2/">
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="pagehome"><!--header-->
<div id="header"><img src="images/header.jpg" alt=""></div>
<!--navigation-->
<div id="navigation"><a id="home" href="index.html" title="Home" name="home"><span>Home</span></a> <a id="windows" href="windows.html" title="Windows" name="windows"><span>Windows</span></a> <a id="communal" href="communal.html" title="Comunal" name="communal"><span>Communal</span></a> <a id="office" href="office.html" title="Office" name="office"><span>Office</span></a> <a id="gardening" href="gardening.html" title="Maintenance &amp; Gardening" name="gardening"><span>Maintenance &amp; Gardening</span></a> <a id="specialist" href="specialist.html" title="Specialist" name="specialist"><span>Specialist</span></a> <a id="contact" href="contact.html" title="Contact us" name="contact"><span>Contact us</span></a></div>
<!--images-->
<div id="pictures">
<div id="img1"><span>Image 1</span></div>
<div id="img2"><span>Image 2</span></div>
<div id="img3"><span>Image 3</span></div>
<div id="img4"><span>Image 4</span></div>
</div>
<!--content-->
<div id="allcontent">
<div id="leftcontent">
<div id="contenttitle">
<h3>Cleaning, Window Cleaning &amp; Gardening Services</h3>
</div>
<div id="contenttext">
<p>Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text.</p>
<p>Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text.</p>
<p>Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text.</p>
<p>Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text.</p>
<p>Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text.</p>
<p>Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text.</p>
<p>Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text.</p>
<p>Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text. Lots of text.</p>
</div>
<div id="contentfooter">
<p class="pfoot">Copyright � 2009 Expectations Property Services, Altrincham UK</p>
<p class="pfoot">Created by <a href="http://www.pheel.co.uk/">Pheel Web Solutions</a></p>
</div>
</div>
<div id="rightcontent">
<div id="rightcontentbox">
<form name="enquire" method="post" action="/enquire.php" id="enquire">
<table>
<tr>
<td><label for="Name">Name</label></td>
<td><input type="text" name="Name" size="20" id="Name"></td>
<td><label for="Service">Select Service</label></td>
</tr>
<tr>
<td><label for="Phone">Phone</label></td>
<td><input type="text" name="Phone" size="20" id="Phone"></td>
<td rowspan="3"><select name="Service" size="5" id="Service">
<option>Windows</option>
<option>Communal</option>
<option>Office</option>
<option>Maintenance</option>
<option>Specialist</option>
<option>Other</option>
</select></td>
</tr>
<tr>
<td><label for="Mobile">Mobile</label></td>
<td><input type="text" name="Mobile" size="20" id="Mobile"></td>
</tr>
<tr>
<td><label for="Email">Email</label></td>
<td><input type="text" name="Email" size="20" id="Email"></td>
</tr>
<tr id="submitbutton">
<td colspan="3"><input type="image" src="images/submit.png" value="Submit" alt="Submit"></td>
</tr>
</table>
</form>
</div>
</div>
<div id="rightfooter"><span>Footer</span></div>
</div>
</div>
</body>
</html>

Code (markup):

~eric

 

Hi Eric,
Thanks but the background color to #contenttext is not supposed to be white. It's supposed to be stripey if you take a look at the site via IE.

Thanks for the code, I didn't really check it's validity until just now. Infact, your code managed to solve the problem of having a space between the header and nav, but only in IE - it's still there in FireFox...

Thanks though!

 

Oh and eric... the table is for the layout of a form - I've always been told this is still allowed in a "tableless" design because it is proper use of a table, instead of just for page layout.

 

@mcfc4eva,

So now are you ready to apologize for your post #20?

 

Pish posh. Lets move to the other thread.

~eric

 

Although it goes against my religion, I have an ego. However it's usually harmed by sites which are better than mine, done better than what I can do, or done by someone who's younger than me who started this HTML and CSS stuff after I did and is even further along than I (or got additional skills along the way that I didn't, such as Javascript or a back-end language or some of that RDFa junk). And there are at least two of those people on this forum.

 

I'm 17 and have been doing this for 7 months. I assume I am not one of those people you talk of?

~eric

 

Lawlz, no. But one of them is very young, 20. He's not here much anymore though.

 

Unfortunately I have not been on much either. I mainly go to devshed forums right now. Sometimes sitepoint

 

DevShed? I thought they renamed that to DeadHead. Oh, sorry. That's just my nickname for them.