+ Reply to Thread
Results 1 to 4 of 4

Thread: CSS transition problem - need help.

  1. #1

    Default CSS transition problem - need help.

    Hi all,

    I have been trying to fix a cross-browser compatibility issue on my coursework page. The problem comes from the transition effect of CSS3 and it occurs on every browser apart from firefox (very strange). The rounded rectangles on the page are supposed to slowly transition colour to yellow and increase 'border-radius' to form an ellipse. In firefox both transitions work as they should. In every other only the 'background-color' changes properly - the border transitions instantly instead of slow linear change.

    Does anyone have any ideas? I do not see anything wrong with the code. I have tried to look for a solution online but nothing relevant came up.

  2. #2


    I have just found out what the problem is - it is the code. I have tried to transition a border-radius:25px into border-radius:100% it appears that the browsers apart from Firefox cannot transition px -> % it has to be px -> px or % -> %. I have not tried % -> px but I would assume that it is not supported as well.

    Very strange that only the Firefox guys have implemented it. In my opinion it should be supported by all browsers.
    Last edited by Vlad; 28th Jan 2012 at 08:24 pm.

  3. #3


    That's a great effect, like the font too

  4. #4

+ Reply to Thread

Similar Threads

  1. problem with margin!
    By hn112 in forum Code
    Replies: 2
    Last Post: 25th Nov 2011, 08:02 am
  2. Don’t Forget About “transition: all”
    By Impressive Webs in forum Web Design RSS Feeds
    Replies: 0
    Last Post: 23rd Nov 2011, 09:09 pm
  3. The Problem with CSS is...
    By David in forum Code
    Replies: 0
    Last Post: 23rd Oct 2008, 12:42 pm
  4. Shu's IE problem
    By francis in forum Browsers and Software
    Replies: 1
    Last Post: 3rd Dec 2004, 12:57 pm
  5. PX to EM Transition
    By David in forum Code
    Replies: 8
    Last Post: 16th Dec 2003, 12:49 pm


Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts