Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 6 of 6
Like Tree1Likes
  • 1 Post By Hammadsiddiqui

Thread: CSS 3.0 Rotation - not rotating ?

  1. #1
    Member
    Join Date
    Aug 2013
    Posts
    89
    Member #
    37057

    CSS 3.0 Rotation - not rotating ?

    Chrome version 33 has support for 2D Rotation (CSS 3.0), I have class and within the class a front class and a back class here are my style; but the word is not rotating ?

    Code:
    h3.gallery {font-size:6em;margin-left:56px;}
    	h3.gallery > .front a {position:relative;
    		transform:perspective(500px;) rotateX(0deg);
    		transition: transform .2s linear 0s;
    	}
    	h3.gallery:hover > .front {
    	transform: perspective(600px) rotateY(-180deg);color:yellow;
    	}

  2.  

  3. #2
    Junior Member Hammadsiddiqui's Avatar
    Join Date
    Feb 2014
    Posts
    10
    Member #
    38554
    Liked
    1 times
    Please always add vendors prefixes first in transistion properties like -moz-transform, -webkit-transform,-o-transform

    Sent from Samsung Galaxy S4 GTi9505
    Ronald Roe likes this.

  4. #3
    Member
    Join Date
    Aug 2013
    Posts
    89
    Member #
    37057
    .gallery {font-size:3em;-webkit-backface-visibility: hidden;}
    /*.gallery .back {-webkit-transform-style: preserve-3d;-webkit-perspective: 600px;-webkit-transition: all .4s ease-in-out;}*/
    .back {font-size:3em;colorrange;position:relative;bottom:45px;right:17px;pos ition:absolute;}
    The CSS never pasted in the message. Arghh this is frustrating me.

  5. #4
    Senior Member RDesignista's Avatar
    Join Date
    Feb 2012
    Location
    Coconut Tree City
    Posts
    822
    Member #
    30921
    Liked
    123 times
    Yeah, you need vendor prefixes for Chrome transformations. -webkit- will do it. Same for using @keyframes as well. Very interesting because you don't -webkit- really elsewhere with border-radius, background, or opacity. It's a CSS3 thing.

  6. #5
    Member
    Join Date
    Aug 2013
    Posts
    89
    Member #
    37057
    I've moved around the vendor prefixes between style sheets a dozen times, it continues not to work, one minute I think I've made progress then I realize that something is cut off.

  7. #6
    Junior Member
    Join Date
    Apr 2014
    Location
    Atlanta
    Posts
    1
    Member #
    38925
    at my generation, CSS3 auto customization right now like box shadows are now easy because of ready made from websites


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 09:42 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com