Support » Fixing WordPress » Moz border radius not working in Firefox 3.5

  • mlopezart

    (@mlopezart)


    This is strange…for the first time IE picked up something that Firefox could not! The -moz radius CSS3 is not working for it. Can anyone pinpoint exactly what I’m doing wrong? My site is here, go to Member Login as “tester” with “tester” as password too. Then click this link again. Try both browsers and see for yourself! Thank you in advance!

    #container {
    -moz-border-radius: 1em
    -webkit-border-radius: 1em;
    border-radius: 1em;
    }
Viewing 5 replies - 1 through 5 (of 5 total)
  • Doodlebee

    (@doodlebee)


    You’re missing a semi-colon after the first line.

    -moz-border-radius: 1em

    should be

    -moz-border-radius: 1em;

    mlopezart

    (@mlopezart)


    Thanks, doodlebee, but that didn’t fix it.

    Something weird just happened—when I got home (doing the site for work) I viewed it, and as it was loading, the bottom corners were rounded! BUT, once it completed to load, it went back to squared! All I need is to round out the bottom left and right corners of the site, but the as soon as the footer loaded in its entirety, it “covered” the nice round corners and went back to square.

    Any help is much appreciated.

    Doodlebee

    (@doodlebee)


    What rounded corners are you referring to? I’m running Firefox on Mac OSX, and they’re rounded.

    edit: OIC.

    remove this line from your footer:

    background-image:url(‘http://vrpsych.ict.usc.edu/wp-content/test/2010/10/footer_bgheader7.jpg’);

    it’s covering your rounded corners.

    You might want to validate – you’re missing some tags, and your css file should have everything in lowercase. Validating would help find your errors.

    mlopezart

    (@mlopezart)


    Using Firefox 3.5

    This is too weird. Let me install the latest version and I’ll let you know…

    mlopezart

    (@mlopezart)


    Awesome. Thank you. Since I can’t delete it since it was my footer’s image, I instead placed the moz code along with the footer like so:

    #footer {
    	clear:both;
    	min-height:30px;
    	height:auto;
    	height:40px;
    	background-image:url('http://vrpsych.ict.usc.edu/wp-content/test/2010/10/footer_bgheader7.jpg');
    	text-align: left;
    	padding:0px 0 0 0;
    	width:100%;
    	margin:10px 0 0 0;
    	-moz-border-radius-bottomright: 1em;
    	-moz-border-radius-bottomleft:  1em;
    }

    Works perfectly. Thank you so much, Doodlebee!!! God bless!

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Moz border radius not working in Firefox 3.5’ is closed to new replies.