new design b0rking

[sean.ferguson]

i have got this far making an xhtml1.1 compliant design, but it wont view correctly in firefox, ironically IE displays it perfectly :twisted:
and my css doesnt validate yet, could this be the cause of the firefox breakage? i get these 3 errors:

• Line: 3 Context : body Property font-face doesn't exist : arial
• Line: 10 Context : table , td Invalid number : text-alignjustified is not a text-align value : justified
• Line: 48 Context : .sidebar Invalid number : widthonly 0 can be a length. You must put an unit after your number : 126

the font-face is easy for me to fix, just as the text align... i will need to make it left aligned but i was pretty sure there was a justified value.
Point is the last error, what i have is:

  .sidebar {
     float: left;
     width: 126px;
     border-right: 1px solid #000000;
     padding: 2px;
  }

i dont get what it means by adding a unit after the width value? you can see the main beta here

 

[Geffy]

text-align: justify
I'll look at the other bit in a sec

just downloaded your css file and removed font-face, that one to my knowledge just doesnt exist.
editted text-align: justified to justify
and added px to the width number and it is now valid.

How about this, you lend me a fiver and in a days time I will give you a tenner back.

Now in that situation you would most likely give me £5 wouldnt you

a day later I come back and I give you 10p, you would probably complain and say I owe you £10 or at least £5. I can refute this by saying that never in the deal did I mention any units, I never exclusively said five pounds or ten pounds. So what I did is all perfectly within the scope of our deal

thats a little story my Chemistry teacher told me to show people the value of defined units.

 

[sean.ferguson]

hehe, nice

so now i have valid xhtml 1.1 and a valid stylesheet... but its still b0rking to high heaven in firefox. Any ideas or pointers on how i can make it browser friendly, because quite frankly having it work in IE but in nothing else is not a good thing

 

[Khayman]

I'm pretty sure its because your floating some of the tables. I know IE and FF handle floats differently cause i had major problems sorting that out myself

what you need to do is put a "float anchor" in just above the copyright table

This is the way i done it. Put this in the html just above the copyright tabletable

<div class="float_anchor"></div>

and then put this in the css file

.float_anchor
{
	clear:both;
}

Seems to work ok on your site when i tried it

 

[sean.ferguson]

thanks, well thats closer, but now the tables are in the wrong location. i need the content table to be alongside the sidebar

 

[Khayman]

well the easy way around it is to take out the floats ion the content and the sidebar and then to add an extra TD in the sidebar table and put the content table in that. then add valign="top" to the sidebar TD

Seems to work

 

[sean.ferguson]

thanks khayman, that solved the most part of my problems

**edit: damn, thats broke my xhtml 1.1 :bored:

 

[Khayman]

Validated for me, odd?

 

[sean.ferguson]

go back to the page and look at the source, see if i done it right? it appears to be this bit causing the problem:

<td class="content"><h2>december, 2004</h2>
<h3>content filler</h3>

 

[Khayman]

You need to end the previous td
put

</td><td>

before

 <td class="content">

 

[sean.ferguson]

thanks, that fixed it