ChrisF07 Posted April 18, 2022 Share Posted April 18, 2022 Site URL: https://ellipse-gar-5ewa.squarespace.com I'm using this code to style gallery iamges and captions, however the font size is very small on display and does not change when I change the pixel size (currently set to 40px). Can anyone help? (see attached image for screenshot) Thanks! .gallery-caption { position: absolute !important; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; text-align:center; opacity: 1; transition: all .3s ease; color: white; height: 100%; p {font-size:40px;} } .gallery-masonry-item:hover .gallery-caption { transition: all 1s ease !important; display:none; } .gallery-caption-wrapper { display: flex; place-items: center; justify-content: center; } .gallery-masonry-item { img { -webkit-filter: brightness(50%); filter: brightness(50%); transition: all .7s ease; }} .gallery-masonry-item:hover { img { -webkit-filter: brightness(100%); filter: brightness(100%); transition: all .7s ease; }} Link to comment
tuanphan Posted April 19, 2022 Share Posted April 19, 2022 Change this code .gallery-caption-wrapper { display: flex; place-items: center; justify-content: center; } to this .gallery-caption-wrapper { display: flex; place-items: center; justify-content: center; } .gallery-caption-wrapper * {font-size: 12px !important;} Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment