Collection page text box

[Rickyxane]

Hi guys,

I’ve made a text box on the collection page but on desktop it is not presenting as I want it to. I’m using the symmetry theme.

www.ciara-kildare.com

This is on mobile, text with a box. As I want it to have it like.

This is how it is presented on desktop (without a box)

This is coded in the main.css

.tekstvak-container {
    max-width: 100%;
    width: 80%;
    margin: 20px auto;
    padding: 20px;
    background-color: #f8f8f8;
    border: 1px solid #ddd;
    text-align: center;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
    font-family: Arial, sans-serif;
}
@media (max-width: 768px) {
    .tekstvak-container {
        width: 95%;
    }
}

This code I’ve used for the custum liquid:

    ## WE ZIJN AAN HET SLUITEN
    

Na 20 geweldige jaren nemen we afscheid. Profiteer nog van onze laatste kortingen en koop je favoriete items voordat we definitief sluiten.

Can someone help me please? Would really appreciate it!

[DaisyVo]

Hi @Rickyxane

Could you share the detailed URL of the box section? I can’t seem to find it in the store?

[Rickyxane]

Hi @DaisyVo https://ciara-kildare.com/collections/silk-dress-collection for example.

On mobile it is behaving as I would like it to, on desktop not.

Thank you for your time.

[DaisyVo]

Hi @Rickyxane

You can try to follow this step
Step 1: Go to Edit code
Step 2: Find file main.css and add this code at the end of the file

@media (mix-width: 990px) {
.custom-html {
    background: #f8f8f8 !important;
    padding: 20px !important;
    border: 1px solid #ddd !important;
}
}

Result:

Best,

Daisy