css3 - Skew background image without distortion? -



css3 - Skew background image without distortion? -

i need skew shape of div contains background image, without distorting background image.

right i'm using transform: skew(-25deg)

is possible without distortion?

you need add together background image on kid of skewed element , apply opposite skew child. here's example:

class="snippet-code-css lang-css prettyprint-override">.parent { height: 100px; overflow: hidden; transform: skew(0.5rad, 0); width: 100px; } .child { background: linear-gradient(to right, reddish 0%, bluish 100%); height: 100%; transform: skew(-0.5rad, 0); width: 100%; } class="snippet-code-html lang-html prettyprint-override"><div class="parent"> <div class="child"> etc. </div> </div>

css3

-

Comments

Post a Comment

Popular posts from this blog

maven fortify plugin : Unable to load build session with ID XXXXX .. See log file for more details -

maven fortify plugin : Unable to load build session with ID XXXXX .. See log file for more details - i took refrence : generating fortify study in maven but invoking : mvn sca:scan throws below error : unable load build session id xxxxx .. see log file more details. [error] error invoking sourceanalyzer. exit code: 1. verify project settings , sca installation. i tried looking around various posts , no luck. could please advise. directly running "mvn sca:scan" not work. next needs executed before "mvn sca:scan"" mvn sca:translate plugins fortify sca
Read more

c# - Primavera WebServices does not return any data -

c# - Primavera WebServices does not return any data - i using primavera webservices (version 6.2.1) read info primavera database (sqlserver 2008r2) in winform application (c#). utilize http cookie container authentication mode. before moved database new server able login , read info primavera database when moved db (using backup , restore), can still login db primavera webservices homecoming null request. this code login: authenticationservice authservice = new authenticationservice( ); authservice.cookiecontainer = new system.net.cookiecontainer( ); authservice.url = _p6wsauthenticationservice; login loginobj = new login( ); loginobj.username = pv_username; loginobj.password = pv_password; loginobj.databaseinstanceid = 1; loginobj.databaseinstanceidspecified = true; loginobj.verbosefaults = true; loginobj.verbosefaultsspecified = true; loginresponse loginreturn = authservice.login( loginobj ); readdatabaseinstancesresponsedatabaseinstance[] rea...
Read more

android - Display emoji panel with genymotion - keyboard/touch input? -

android - Display emoji panel with genymotion - keyboard/touch input? - i seek no luck open panel emoji icons cannot find if possible on genymotion (?) input keyboard. regards go settings->language , input->current keyboard turn on "show input method" switch. this cause keyboard appear on screen when input text, way android works on device doesn't have hardware keyboard. can utilize input emoji. if there's improve way, or way, don't know it. android android-emulator avd genymotion emoji
Read more