Solved

firefox css3 problems

Posted on 2011-03-15
2
618 Views
Last Modified: 2012-05-11
I used the help of a tutorial to get my page to look how i wanted it using HTML5 and CSS3.  It looks correct in safari which is what i use on my mac, but when viewed in firefox it stretches the length of the page, the background isn't the same design and the images/buttons in the <nav> </nav> tags don't work.  I've been messing with the code for moz and webkit but i can't get the firefox one to look like the safari one.  Any ideas on what particular part would be causing this?

It can be viewed here: www.digitalnatives411.com/testing and the CSS3 file is www.digitalnatives411.com/testing/styles.css
0
Comment
Question by:newmie22
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
2 Comments
 
LVL 42

Accepted Solution

by:
David S. earned 500 total points
ID: 35141873
Firefox 3.6 does not supply default styles for the new HTML 5 block-container elements.
(Firefox 4 does though.) What you need to do is add this to your stylesheet:
article, aside, footer, header, hgroup, nav, section {
	display: block;
}

Open in new window

You'll also need the HTML5 Shim for IE6-8: http://code.google.com/p/html5shim/
0
 

Author Closing Comment

by:newmie22
ID: 35143009
Great, thank you so much!
0

Featured Post

Secure Your WordPress Site: 5 Essential Approaches

WordPress is the web's most popular CMS, but its dominance also makes it a target for attackers. Our eBook will show you how to:

Prevent costly exploits of core and plugin vulnerabilities
Repel automated attacks
Lock down your dashboard, secure your code, and protect your users

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Have you tried to learn about Unicode, UTF-8, and multibyte text encoding and all the articles are just too "academic" or too technical? This article aims to make the whole topic easy for just about anyone to understand.
Finding original email is quite difficult due to their duplicates. From this article, you will come to know why multiple duplicates of same emails appear and how to delete duplicate emails from Outlook securely and instantly while vital emails remai…
In this tutorial viewers will learn how to embed videos in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <video> tag to insert a video. Define the src as the URL of your video; this is similar to …
In this tutorial viewers will learn how to style rounded corners for elements in CSS using the border-radius property Begin with a normal styled element such as a div: To style all four corners of the div to be the same degree of roundness, use the …

696 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question