Support for Drupal 7 is ending on 5 January 2025—it’s time to migrate to Drupal 10! Learn about the many benefits of Drupal 10 and find migration tools in our resource center.
Hello,
I recently made my videojs player responsive with this code:
* {max-width: 100%} /* the usual RWD shebang */
.video-js {
width: auto !important; /* override the plugin's inline dims to let vids scale fluidly */
height: auto !important;
}
.video-js video {position: relative !important;}
/* The video should expand to force the height of the containing div.
One in-flow element is good. As long as everything else in the container
div stays `position: absolute` we're okay */
.video-js .vjs-big-play-button {
top: 50%; /* errrr, why isn't the play button centered in the default skin? :) */
left: 50%;
margin:-4em 0 0 -6em; /* the old negative margin trick */
}
But it broke my jCarousel slideshow CSS. It assigns the auto width to it to (because they are both in grid-inner clearfix) and now my overflow is all over my front page, because of the width. Any ideas how to fix it ?
Thanks
Comments
Comment #1
etz01 CreditAttribution: etz01 commentedFound the problem - did not notice the
* {max-width: 100%}
* automatically over-writes everything, so that broke the CSS. Hope this helps someone else too.Comment #2
etz01 CreditAttribution: etz01 commented