min-height, does not work on mobile what do I do? [closed]

Question

min-height, does not work on mobile what do I do? [closed]

Navigation

#1 by (1 votes)

0

I'm developing a desktop and mobile site, but when I'm on the mobile, I have to decrease the height of the slider on the right mobile, however when I put min-height: 250px! important, it will not, even me trying for all the forms I can not solve see the example

Desktop code:

.banner ul li {
    display: block;
    float: left;
    width: 33%;
    padding: 160px 0 110px;
    min-height: 506px !important;
    box-shadow: inset 0 -3px 6px rgba(0,0,0,.1);
}

Mobile Code:

@media screen and (max-width:320px) {
    .banner ul li {
         min-height:250px  !important;
         overflow:hidden;
         background-size: 100% 250px !important;
         box-shadow: inset 0 -3px 6px rgba(0,0,0,.1);
    }
}

======

Can you tell me what I can do?

html css

asked by anonymous 12.01.2015 / 19:28

1 answer

Make select and move to the graphical interface How to clean the inputs after performing an ajax request?

score 1 · Answer 1

The problem is that you have a condition for means of type screen , of which mobile is not part. Remove this condition, leaving it this way:

@media (max-width:320px) {
    .banner ul li {
        min-height:250px  !important;
        overflow:hidden;
        background-size: 100% 250px !important;
        box-shadow: inset 0 -3px 6px rgba(0,0,0,.1);
    }
}

Example working: link