PDA

View Full Version : New vs Old Firefox - same CSS ?


Rob_Che
08-09-2008, 05:13 PM
OK... I'm afraid I don't have the page live to show at this stage but I have a laptop that has the latest version (3?) of FF. My PC tower has the previous version (2?)...

I'm having issues with margins... they seem to be 1px out from version to version !? what !?,,,

I've been away a while - have we have a new FF thread ?

Rob

Rob_Che
08-09-2008, 05:21 PM
argh... Font sizes are wildly different too,,, what going on?

domedia
08-11-2008, 01:54 PM
Hi Rob,
What are you talking about??

Rob_Che
08-11-2008, 10:36 PM
haha... just experiencing differences in the way the new FF handles CSS...

I'll let you know when I've pinned it down... hmmm... :)

domedia
08-12-2008, 01:10 AM
Can you show us anything so we can help? :)

Death Dream
08-13-2008, 04:18 PM
Didn't I tell you guys that is what happened with my site? I had it looking nice on FF2 and when I tried the FF3 Beta I said it made my site look different. Not sure where I posted that though .... But I know I posted it!

IE6, 7, and soon 8, FF2 and FF3. That is the minimum we can design for it seems now. Go a step farther with Safari, but I think that handles like FF.

~Death Dream~

Rob_Che
08-14-2008, 08:06 AM
Can you show us anything so we can help? :)

OK Domedia... Maybe you can try it an see if it's just my PC...

I'm working on this WP Blog - http://blog.wireroses.co.uk

The liks in the header (just text at the mo) are showing different font sizes in FF2 & FF3... how? why?

Does anyone else see what I see ? :roll:

Cheers
Rob

edbr
08-14-2008, 10:21 AM
have you tried browsershots.org?

edbr
08-14-2008, 10:45 AM
i just checked a site ( not yours) but ff3 for mac is very different on windows 2 & 3 seem the same

Death Dream
08-14-2008, 02:34 PM
Should see it on Linux O.O

~Death Dream~

domedia
08-14-2008, 04:06 PM
Looks good here but you should probably make those dummy links now so you don't get into problems later. You know they're not going to be just text, so don't test with it.

The CSS for the block is weird:
#main-nav { /*wordpress.css (line 40) */
bottom:0pt;
display:inline;
float:right;
font-size:22px;
height:40px;
margin:0px 85px 70px 0pt;
position:absolute;
right:0pt;
width:420px;
}

Since you are using absolute positioning you can take out FLOAT and DISPLAY.
FLOAT because you cannot float an absolutely positioned element.
DISPLAY because it makes no sense to make it inline.

Rob_Che
08-14-2008, 04:35 PM
Cheers Dom... It's from a Tut' I had ages ago - I haven't stripped it out yet... I will though... I'm done with tutorials ! ;)

I'll sort it...

Cary
08-15-2008, 11:36 PM
Also make sure you validate (http://jigsaw.w3.org/css-validator/validator?profile=css21&warning=0&uri=http%3A%2F%2Fblog.wireroses.co.uk%2F) the CSS. You can find things like where you used "margins" instead of "margin" or a semicolon instead of a colon.

Rob_Che
08-17-2008, 10:23 AM
Cheers Cary - sloppy mistakes. Coding at 2am is never a good idea.

The HTMl and CSS validate now which I'm really pleased about.

Validating Wordpress' HTML can be a nightmare as it writes some of it server side, sometimes overriding what you've uploaded... odd.

Thanks guys...

Rob_Che
08-17-2008, 10:39 AM
Re above; the Wordpress pages are PHP - just ask DJ how I get along with PHP - clearly not my first language (or 3rd or 4th for that matter !)

Rob_Che
08-18-2008, 12:13 AM
OK - here you go;
New Firefox at the top... Old at the bottom... I'm gonna be swinging from the rafters if I don't figure this out soon...
http://www.wireroses.co.uk/firefox.jpg

Cary
08-18-2008, 04:24 AM
I'm afraid you have some invalid markup which browsers don't know what to do with...
<li id="recent-posts" class="widget widget_recent_entries">Recent Posts
<ul>
<li><a href="http://blog.wireroses.co.uk/?p=8">Doncaster Pride </a></li>
<li><a href="http://blog.wireroses.co.uk/?p=6">New site underway! </a></li>
</ul>
</li>


Also, you have a closing div coming after </html> instead of before </body>

Rob_Che
08-18-2008, 08:40 AM
Cheers Cary - it's a nightmare validating the Wordpress code.

The widgets write server side code. I had it all validated, added a widget and now it's all over the place. Very frustrating...

It usually means just adding a couple of <ul 's> to wrap the <li > items...
But it's finding where they need to go as what you see in the editor is not what is eventually written... crazy PHP ! :)

Any idea why the new Firefox reads it so differently ?

Rob_Che
08-18-2008, 08:40 AM
Also, you have a closing div coming after </html> instead of before </body>

Well I didn't put it there ! ;)

davidj
08-18-2008, 08:54 AM
is this your personal site rob?

Rob_Che
08-18-2008, 10:33 AM
is this your personal site rob?

It isn't, no :roll:

Not sure if that's a "... this shouldn't be live if it's a customer's site"...
or a Gay Pride comment...

davidj
08-18-2008, 11:14 AM
hahahaha

Ooo suits you!

Rob_Che
08-18-2008, 12:39 PM
I did go to the Doncaster Pride event as it happens. Very enlightening.
So much so I tore my eyes out with fishing hooks on my return home.

Anyway... thanks for your inout DJ ;)

Rob_Che
08-18-2008, 02:56 PM
Slight typo there...
Meant to read "thanks for your input" not, "thanks for your inout"... oops.

davidj
08-18-2008, 03:43 PM
i reckon that was a freudian slip regarding the subject matter!

Corrosive
08-18-2008, 05:28 PM
Slight typo there...
Meant to read "thanks for your input" not, "thanks for your inout"... oops.

So are you in or out Rob?

Rob_Che
08-18-2008, 11:52 PM
http://www.w3.org/Icons/valid-xhtml10
http://jigsaw.w3.org/css-validator/images/vcss