css - jQuery cycle.lite plugin - how to give containing div a responsive height? -


How can I style this page so that the height of the slide show div is the height of the images in the slideshow? & lt; Html & gt; & Lt; Style & gt; IMG {width: 100%;} & lt; / Style & gt; & Lt; H1 & gt; Screenshots & lt; / H1> & Lt; Div id = "slide" style = "position: relative;" & Gt; & Lt; Img src = "https://multibit.org/images/en/screenshots/help-contents.png" & gt; & Lt; Img src = "https://multibit.org/images/en/screenshots/send.png" & gt; & Lt; / Div & gt; & Lt; H1 & gt; Hidden Text - How Can I See It? This text is hidden beneath the slide show & lt; / H1> & Lt; Script src = "https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" & gt; & Lt; / Script & gt; & Lt; Script src = "https://multibit.org/jquery/plugins/cycle/jquery.cycle.lite.js" & gt; & Lt; / Script & gt; & Lt; Script & gt; $ (Function () {$ ('# slide'). Cycle ({delay: -1000,});}); & Lt; / Script & gt; & Lt; / Html & gt;

enter image details here

moment , The height of the div is considered to be zero, so the text is hidden beneath the slide below. Thanks!

explanation :

inside your slide div Due to the complete position of the images, the height is falling, i.e. its height is covered with zero.

You can overcome this problem by setting a minimum height for parents:

  #slide {min-height: 352px; } And  

Comments

Popular posts from this blog

c - Mpirun hangs when mpi send and recieve is put in a loop -

python - Apply coupon to a customer's subscription based on non-stripe related actions on the site -

java - Unable to get JDBC connection in Spring application to MySQL -