Forum:
Hi all I am having some trouble with changing my text font within an album showcase feature. When I inspect the gallery the font refuses to inherit my body font. I suspect this is from the predetermined property of the gallerys code being set to initial instead of inherit. This, however, I have no idea how to fix. I tried to force the text to inherit the already established font through the section dedicated to the text, but that did not work. Might be obvious to more adept coders but I am not one of those people haha. I will include the gallerys code and, if needed, I will include my main code with my font for anyone who asks. Thank you so much to whoever can help!
Gallery Code:
<style>
#vinyl-gallery * {
all: unset;
}
#vinyl-gallery {
all: initial!important;
width: 100%!important;
height: 230px!important;
margin: 30px 0!important;
display: flex!important;
flex-direction: row!important;
position: relative!important;
margin-left: -6px!important;
}
#vinyl-gallery .vinyl {
all:unset!important;
perspective: 500px !important;
width: 18px!important;
transition: width 0.5s!important;
}
#vinyl-gallery .vinyl:hover {
width: 148px!important;
}
#vinyl-gallery img {
all:unset!important;
transition: transform 0.5s, width 0.5s, height 0.5s, margin-top 0.5s!important;
width: 180px!important;
height: 180px!important;
transform: rotateX(0deg) rotateY(25deg)!important;
transform-style: preserve-3d!important;
border-radius: 4px!important;
border: 2px solid rgba(0, 0, 0, 0.1)!important;
object-fit: cover!important;
}
#vinyl-gallery .vinyl:hover img {
transform: rotateX(0deg) rotateY(10deg)!important;
width: 188px!important;
height: 188px!important;
margin-top: -2px!important;
}
#vinyl-gallery .title {
color: #ffffff;
display: block;
visibility: hidden;
position: absolute;
bottom: 0px;
text-align: center;
width: 100%;
padding-left: 6px;
}
#vinyl-gallery .vinyl:nth-child(n):hover + .title {
visibility: visible;
}
</style>
<div id="vinyl-gallery">
<div class="vinyl">
<img src="https://upload.wikimedia.org/wikipedia/en/a/a5/WhiteZombie-AstroCreep2000.jpg"/>
</div>
<div class="title">White Zombie - Astro-Creep: 2000 - Song of Love, Destruction and Other Synthetic Delusions of the Electric Head - 1995</div>
<div class="vinyl">
<img src="https://upload.wikimedia.org/wikipedia/en/5/5f/Bodypop.jpg"/>
</div>
<div class="title">And One - Body Pop - 2006</div>
<div class="vinyl">
<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRM4eYQRXRy8XYkEJhjXXTslwWGq8rE2GT3LJCt-oa43w&s=10"/>
</div>
<div class="title">Alice in Chains - Jar of Flies - 1994</div>
<div class="vinyl">
<img src="https://i.scdn.co/image/ab67616d0000b273ff7871e35825b5aea95beff3"/>
</div>
<div class="title">Type O Negative - October Rust - 1996</div>
<div class="vinyl">
<img src="https://upload.wikimedia.org/wikipedia/en/thumb/7/7d/Above_%28Mad_Season_album%29.jpeg/250px-Above_%28Mad_Season_album%29.jpeg"/>
</div>
<div class="title">Mad Season - Above - 1995</div>
<div class="vinyl">
<img src="https://upload.wikimedia.org/wikipedia/en/5/59/SheWantsRevenge.st.jpg"/>"/>
</div>
<div class="title">She Wants Revenge - She Wants Revenge - 2004</div>
<div class="vinyl">
<img src="https://upload.wikimedia.org/wikipedia/en/c/c8/Primus_Tales_From_the_Punchbowl.jpg"/>"/>
</div>
<div class="title">Primus - Tales From the Punchbowl - 1995</div>
<div class="vinyl">
<img src="https://m.media-amazon.com/images/I/81JQN1pvJKL._UF1000,1000_QL80_.jpg"/>"/>
</div>
<div class="title">Acid Bath - When the Kite String Pops - 1994</div>
</div>
Report Topic
Permalink