My website, small problem

Soldato
Joined
25 Nov 2004
Posts
4,788
Location
Hertfordshire
Link here Click!

Everything working ok, but my main problem is the home page doesn't display correctly in Firefox. All other pages are fine... :confused:

All pages display correctly in IE. Can anyone spot my error?

Also, any other comments appreciated. :)
 
Permabanned
Joined
21 Apr 2004
Posts
13,312
Location
Wolverhampton
First things first, place a global margin and padding value at the top of your CSS

Code:
* {
  margin: 0px;
  padding: 0px;
}

This will reset any elements you haven't styled further down your CSS. For example, some elements have different default settings in different browsers.

This will often muck up layouts, especially in those in which every pixel counts.
 
Soldato
OP
Joined
25 Nov 2004
Posts
4,788
Location
Hertfordshire
Ok, done that and it basically sets everything to the far left of the screen...do I need to center everything that hasn't been set now?

Why would FF display all pages except index correctly?
 
Permabanned
Joined
21 Apr 2004
Posts
13,312
Location
Wolverhampton
Yes, you need to style your DIVs now so that they are back how they were. You'll be secure in the knowledge then that it isn't padding or margins (the most common demon) that is screwing with your layout.

Do you have different elements on your index page?
 
Soldato
Joined
18 Oct 2002
Posts
5,464
Location
London Town
The problem is caused by the cols attribute of the <textarea> on your front page. 110 is too large a value for the width of the containing element. Reduce the value to make it fit.

However, a better option would be to not use a <textarea> for that purpose. A <textarea> is a "multi-line text input control" (from W3C Spec), designed for forms. It is not just for the creation of a simple display box that scrolls when content overflows. If you want a scrolling box, use a <div> to contain those <p>aragraphs and set its overflow property to scroll. Use the CSS width/height properties where relevant.
 
Last edited:
Soldato
OP
Joined
25 Nov 2004
Posts
4,788
Location
Hertfordshire
Thanks for the replies :)

I've managed to fix the wierd alignment issues by getting rid of the text input box and replacing it with the div, as suggested and used the overflow. (Is the implementation correct?)

However, trying to use the global values in the css and then adjusting the individual items to fit, isn't going that well...the elements don't seem to shift where I want them to go. I'm not sure what it is I'm doing wrong, but I'll give it another go later.

Oh, and somewhere along the line, the footer at the bottom of each page is distorting (getting taller/smaller/moving up the page etc) - but again only in FF.

edit: just to clarify, the footer moves up the page (doesn't stay at the bottom) in FF, and changes size (but stays at the bottom) in IE.
 
Back
Top Bottom