Jump to content

Indent text in accordion

Recommended Posts

Hi All, 

We're redesigning our (mostly image based) website and we discovered the accordion block which seems interesting to organise some text and data in a neat way. However in the accordion we would want to add some information and space the text with tabs/indents like the screenshot image here below. 

image.png.1f9e5ddec1dd0f82b2a957208b17dcbd.png

However it seems that I can only add plain text and no tabs or indents in the user interface. Is there a workaround or code I can use to add tabs in the text so the information keeps alligned? 

Here is a link to the webpage: https://www.fallow.eu/work/tilefactory-1

Thanks in advance!

Matthias

 

 

Link to comment
  • Replies 5
  • Views 1.5k
  • Created
  • Last Reply

Top Posters In This Topic

Hi @tuanphan, 

Your informatin pointed me already in the right direction. I changed the text to bold within squarespace and I added this piece of code: 


.accordion-item__description strong {
    font-weight: normal;
    display: inline-block;
    width: 150pt;
}

However like i expected in my previous message, when the information exceeds one line of text, the text on the next line jumps back to the beginning. Any idea on how to fix this? 

Thanks in advance!

 

image.png

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.