Je pense que le script du conservateur dicte la taille CSS, mais je ne peux pas le faire correctement.

Ici, dans ce jsfiddle, vous verrez:
https://jsfiddle.net/supplement/fmjrvsze/1/

Il peut être plus facile de le consulter directement sur le site:
https://www.mailmyprescriptions.com

Là où il affiche le contenu, les deux premières vidéos YouTube ont les boutons Read more et les deux dernières sont entièrement développées.

Je veux que les quatre éléments (tous même lorsque vous utilisez les boutons Next) sur la page soient entièrement développés et qu'ils n'aient pas du tout le bouton Read more.

J'ai essayé d'ajuster le padding-top de 4em à 0em et je l'ai obtenu presque correctement mais il y avait encore un peu de brume transparente.

.crt-post-v2.crt-post-max-height .crt-post-max-height-read-more {
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    text-align: center;
    padding-bottom: 0.5em;
    padding-top: 4em;
    margin: 0em;
    background: transparent;
    background: -webkit-gradient(left top, left bottom, color-stop(0%, transparent), color-stop(50%, #efefef));
    background: linear-gradient(to bottom, transparent 0%, #efefef 50%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#000000', GradientType=0);
}

Ne faites plus beaucoup de développement frontal ou mobile, donc toute aide serait grandement appréciée. Aidez-moi, s'il vous plaît.

Je veux qu'ils ressemblent tous à ceci:

enter image description here

2
Supplement 19 nov. 2018 à 19:50

3 réponses

Meilleure réponse

Il existe un style max-height:316px en ligne qui est à l'origine de cela.

Voici la solution complète. consultez le codepen ci-dessous.

https://codepen.io/onejeet/pen/NEMxVe

$('.crt-post-c').css('max-height','500px');

$('.crt-post-read-more-button').css('display','none');
$('.crt-post-max-height-read-more').css('background','none');
1
OneJeet 24 nov. 2018 à 05:53

Vous devez modifier les valeurs suivantes en CSS: les valeurs max-height et min-height sur tous les éléments avec la classe .crt-post-c et display les valeurs sur tous les éléments avec la classe .crt-post-max-height-read-more comme suit:

var crtPosts = document.querySelectorAll('.crt-post-c'),
    crtPostsReadMore = document.querySelectorAll('.crt-post-max-height-read-more');

for(var i = crtPosts.length; i--;)
{
    crtPosts[i].style.maxHeight = '800px';
    crtPosts[i].style.minHeight = '400px';
}
for(var i = crtPostsReadMore.length; i--;)
    crtPostsReadMore[i].style.display = 'none';

Voici le CodePen . J'espère que c'est ce que tu veux.

2
Bharata 23 nov. 2018 à 18:12

Je pense que tout ce que vous avez à faire est de supprimer cet affichage: block; puis définissez une nouvelle hauteur maximale sur ce qui est approprié. 600px ou quelque chose

2
getData 20 nov. 2018 à 19:28