Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Doesn't support different image size ? #14

Open
zhouhao27 opened this issue Oct 8, 2015 · 0 comments
Open

Doesn't support different image size ? #14

zhouhao27 opened this issue Oct 8, 2015 · 0 comments

Comments

@zhouhao27
Copy link

I have a layout before using ihover:

screen shot 2015-10-08 at 6 27 28 pm

But when I use ihover it becomes:

screen shot 2015-10-08 at 6 26 39 pm

My html:

        <div class="carousel slide media-carousel-sm visible-sm media-sm" id="section-media-sm">
                <div class="carousel-inner">
                    <div class="item active">
                        <div class="row">
                            <div class="col-xs-6 withborder">

                                <div class="ih-item square colored effect13 bottom_to_top">
                                    <a href="#">
                                        <div class="img"><img src="http://placehold.it/331x260" alt="img"></div>
                                        <div class="info">
                                            <h3>Heading here</h3>
                                            <p>Description goes here</p>
                                        </div>
                                    </a>
                                </div>
                                <!--<a class="thumbnail" href="#">-->
                                    <!--<img alt="" src="http://placehold.it/331x260">-->
                                <!--</a>-->
                            </div>
                            <div class="col-xs-6">
                                <div class="row">
                                    <div class="col-xs-6">

                                        <div class="ih-item square colored effect13 bottom_to_top">
                                            <a href="#">
                                                <div class="img"><img src="http://placehold.it/220x124" alt="img"></div>
                                                <div class="info">
                                                    <h3>Heading here</h3>
                                                    <p>Description goes here</p>
                                                </div>
                                            </a>
                                        </div>
                                        <!--<a class="thumbnail" href="#">-->
                                            <!--<img alt="" src="http://placehold.it/220x124">-->
                                        <!--</a>-->
                                    </div>
                                    <div class="col-xs-6">
                                        <div class="ih-item square colored effect13 bottom_to_top">
                                            <a href="#">
                                                <div class="img"><img src="http://placehold.it/220x124" alt="img"></div>
                                                <div class="info">
                                                    <h3>Heading here</h3>
                                                    <p>Description goes here</p>
                                                </div>
                                            </a>
                                        </div>
                                        <!-- -->
                                        <!--<a class="thumbnail" href="#">-->
                                            <!--<img alt="" src="http://placehold.it/220x124">-->
                                        <!--</a>-->
                                    </div>
                                    <div class="col-xs-6">
                                        <div class="ih-item square colored effect13 bottom_to_top">
                                            <a href="#">
                                                <div class="img"><img src="http://placehold.it/220x124" alt="img"></div>
                                                <div class="info">
                                                    <h3>Heading here</h3>
                                                    <p>Description goes here</p>
                                                </div>
                                            </a>
                                        </div>
                                        <!--<a class="thumbnail" href="#">-->
                                            <!--<img alt="" src="http://placehold.it/220x124">-->
                                        <!--</a>-->
                                    </div>
                                    <div class="col-xs-6">
                                        <div class="ih-item square colored effect13 bottom_to_top">
                                            <a href="#">
                                                <div class="img"><img src="http://placehold.it/220x124" alt="img"></div>
                                                <div class="info">
                                                    <h3>Heading here</h3>
                                                    <p>Description goes here</p>
                                                </div>
                                            </a>
                                        </div>
                                        <!--<a class="thumbnail" href="#">-->
                                            <!--<img alt="" src="http://placehold.it/220x124">-->
                                        <!--</a>-->
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

The code inside is what I used before ihover. Here is the css:

    $carousel-top: 50px;
$carousel-control-offset: -2px;

body
{
  padding-top: $carousel-top;
  background-color: #dfdfdf;
}

.media-up .thumbnail,
.media-sm .thumbnail,
.media-xs .thumbnail {
  margin-bottom: 18px;
}
.media-carousel-xs,
.media-carousel-sm,
.media-carousel-up {
  margin-bottom: 0px;
  padding: 15px;
  border: 0px solid #e5e5e5;
}
.thumbnail {
  img {
    width: 100%;
    position: relative;
  }
}

My question is if ihover support different size images? Thanks.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant