LindseyMexico14 Posted June 16, 2022 Share Posted June 16, 2022 Site URL: https://www.koshersprings.com/adventures Hi! I can't get Yard Games title in the gallery to match the others (centered and white text) Any ideas? See screenshot! Link to comment
LindseyMexico14 Posted June 16, 2022 Author Share Posted June 16, 2022 32 minutes ago, LindseyMexico14 said: Site URL: https://www.koshersprings.com/adventures Hi! I can't get Yard Games title in the gallery to match the others (centered and white text) Any ideas? See screenshot! <style> .slide:hover img { transform:scale(1.05); -moz-transform:scale(1.05); -webkit-transform:scale(1.05); } .slide:hover .image-slide-title { background: rgba(0,0,0,0.4); } .image-slide-title p { max-width: 90% !important; } .image-slide-title { white-space: initial !important; text-overflow: initial !important; transform: translateY(-0.5em); -webkit-transform: translateY(-0.5em); -moz-transform: translateY(-0.5em); -ms-transform: translateY(-0.5em); } .slide .margin-wrapper { overflow: hidden !important; } .slide img { -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -webkit-transition: all ease-in-out 200ms; -moz-transition: all ease-in-out 200ms; transition: all ease-in-out 200ms; } .image-slide-title { -webkit-transform-style: preserve-3d; -webkit-backface-visibility: hidden; -webkit-transition: all ease-in-out 200ms; -moz-transition: all ease-in-out 200ms; transition: all ease-in-out 200ms; height: 100%; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; width: 100%; position: absolute; top: 0; left: 0; background: rgba(0,0,0,0.2); display: block !important; } .image-slide-title strong { text-transform: uppercase; font-size: 26px!important; line-height: 28px; text-align: center; font-weight: 400; letter-spacing: 1px; color: #fff!important; position: absolute; top: 50% !important; left: 50% !important; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .image-slide-title p { font-style: initial; color: #eee; font-size: 12px; font-weight: 100; position: absolute; bottom: 20px !important; left: 50% !important; -webkit-transform: translate(-50%, 0%); -ms-transform: translate(-50%, 0%); -moz-transform: translate(-50%, 0%); transform: translate(-50%, 0%); } @media only screen and (max-width: 640px) { .sqs-gallery-design-grid-slide { width: 100% !important; } } @media ( max-width: 1024px ) { .slide .image-slide-title strong { font-size: 18px; line-height: 20px; } .slide .image-slide-title span { font-size: 11px; line-height: 12px; } } .sqs-lightbox-meta{display: none !important;} </style> Here is the code I found from a past developer but I cannot see how to apply it to the new photo I added yard games Link to comment
tuanphan Posted June 17, 2022 Share Posted June 17, 2022 I see you figured it out? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care 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