nnattawat / flip

A lightweight jQuery plugin to make 3D card flipping animation
Other
624 stars 312 forks source link

Back is shown to the right #54

Closed rockymontana closed 8 years ago

rockymontana commented 8 years ago

Hi. Any thought on how to solve this issue: http://cl.ly/dM7p ? The "back" is shown to the right, and mirrored (as you can see). I've run into this issue many times and don't really know how to deal with it. Here's some code:

Profile page

<div id="user_profile">
    <div class="front">
        @include('admin.users.show')
    </div>
    <div class="back">
        @include('admin.users.edit')
    </div>
</div>

edit

<div class="uk-grid">
    <div class="uk-width-large-7-10 uk-width-medium-1-1">
        <div class="md-card">
            <div class="user_heading">
                <div class="user_heading_menu">
                    <a href="#" id="show"><i class="md-icon material-icons md-icon-light">mode_edit</i></a>
                </div>
                <div class="user_heading_content">
                    <h1 class="heading_b uk-margin-bottom">
                        <span class="uk-text-truncate">{{$user->firstname}} {{$user->lastname}}</span>
                        <span class="sub-heading">Land acquisition specialist</span>
                    </h1>
                </div>
            </div>
        </div>
    </div>
</div>

show

<div class="uk-grid">
    <div class="uk-width-large-7-10 uk-width-medium-1-1">
        <div class="user_heading uk-width-large-7-10 uk-width-medium-1-1">
            <div class="user_heading_menu">
                <a href="#" id="edit"><i class="md-icon material-icons md-icon-light">mode_edit</i></a>
            </div>
            <div class="user_heading_content">
                <h2 class="heading_b uk-margin-bottom">
                    <span class="uk-text-truncate">{{$user->firstname}} {{$user->lastname}}</span>
                    <span class="sub-heading">Land acquisition specialist</span>
                </h2>
            </div>
        </div>
    </div>

</div>
rockymontana commented 8 years ago

http://cl.ly/image/0c3M0q1i0w2R/Image%202015-09-26%20at%209.40.07%20am.png image

Here's to "Illistrate the difference" - I noticed that the previous image might have been a bit unclear

rockymontana commented 8 years ago

Well that's awkward... It was my grid that wasn't wide enough...

Download commented 8 years ago

Ha ha yes. Often, explaining the issue to someone else will help you understand it better yourself... And find the fix. :) Great you found the solution.