yuinia

Hi, Recently I make a video collection page for the company to show our work. And We need a summary block at the home page. Everything works fine but the vimeo thumbnail in the summary block always blurry. Can we use css and anything to upscale the quality? URL：https://www.thehongkongfixer.com/home-1

Hi guys, With all your guys help, I have established a website that is fully functionable and it is my first one! Now I want to polish a bit and have better QoL for the visitors. Under my work show case page, I have a text block on top of my image block which i set up a url for each showcase. Currently I can only click the url when my cursor is on the text itself. How I can make the whole text block clickable? Page I mention :https://www.thehongkongfixer.com/work Best, Alex

Hi @tuanphan， I didn't figure it out yet as i just roll back to previous version. Now the block only clickable when the cursor is on the text. It would be great if i know how to make the whole block clickable and the text stay in 2 line

@tuanphan The url is https://dinosaur-gopher-x6fh.squarespace.com/work

Hi @tuanphan, I am using the code you provide. it work well however the code compress my text line into single line. How can i fix it ? Here is the code. /* Make text box clickable */ .fe-65275e92573640628018fb6d .html-block { position: relative; } .fe-65275e92573640628018fb6d .html-block a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; }

Hi Guys, I have the code that make the logo change to white on hover. However, when move the cursor away, the logo will fade out like 0.3 seconds then the original logo back in. How can i make the white logo fade back to the oringial logo? The current code is /* Apply a fading effect to the original logo on hover */ .header-title-logo img { transition: opacity 0.3s; } /* Reduce the opacity of the original logo when hovering */ .header-title-logo:hover img { opacity: 0; } /* On hover, change the background image of the anchor (logo) and keep the hover logo visible */ .header-title-logo:hover a { background-image: url('https://static1.squarespace.com/static/652614420877815fd80f9b4d/t/6530e213146e4f13196c0109/1697702419568/Logo+fixer+Fulll+White_400Kb.png'); /* Replace with the URL of your hover logo */ background-size: contain; z-index: 1; /* Place the hover logo on top */ } /* Apply a fading effect to the hover logo on hover */ .header-title-logo:hover .logo-hover img { opacity: 1; } /* Reduce the opacity of the hover logo when not hovering */ .header-title-logo img:not(:hover) + a { background-image: none; /* Remove the background image */ opacity: 0; } Website : https://dinosaur-gopher-x6fh.squarespace.com/ pw: makingmovies

Hi guys, I have 2 logo which are black and white. The default logo would be the black one and i want to turn it to white one when hover on it. Is that a way I can make it happen in css? URL: https://dinosaur-gopher-x6fh.squarespace.com/ Pw: makingmovies

Thank for the solution, it works. May i wonder what your code means? just for learning Also i have the same structure in another page, how should i change the code you provide to make it work on another page?

Hi guys, I am new to create website and i have issues with the css. In my "work" page, I create 16 images blocks for my showcases and I add titles on each blocks. I want the title gone when hover so I follow some youtubers code. The code works when i am in editing mode. However, It not working on preview so I wonder what happen or is there anyway i can improve it. the code i am using for each block @media only screen and (min-width: 640px){ #block-yui_3_17_2_1_1697078785160_29302 { opacity: 0; transition: opacity 0.5s } #block-yui_3_17_2_1_1697078785160_29302:hover { opacity: 1; transition: opacity 0.5s }} It is my website : dinosaur-gopher-x6fh.squarespace.com password:makingmovies Thanks for the help.