Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0
mrjack16

Possible to group blocks within a container?

Question

I've seen other website builders that allow you to create an empty container object and then place other objects within it to keep them grouped as a unit.

I'm wanting to put some text, an image and a button in a container and style the container background to create a "card" effect. I assume this is possible with a code block but I'd prefer something that's easier to edit since I'll be making changes to these somewhat frequently.

Share this post


Link to post

15 answers to this question

Recommended Posts

  • 0
8 minutes ago, mrjack16 said:

Exactly like that! How would I add some outside padding on these?

div#page-5c4b76d0898583b89b348bb0 .span-4 {
    border: 1px solid #fff;
    box-sizing: border-box;
    border-radius: 10px;
    padding: 10px;
    background: #f5f 7;
    width: 30%;
    margin: 2% 1.5%;
}

play with width and margin


COVID-19Free priority support for all users (29/03 - 30/04). You can tag me (@tuanphan) or send to my email.

With paid support, see here

How to Setup Password & Share URL

 

Share this post


Link to post
  • 1
5 hours ago, mrjack16 said:

I'm 99% there... one more question, how that I have the margin and padding where I want it, what's the preferred method of getting everything centered on the page?

play with padding left

/* Desktop */
@media screen and (min-width:901px) {
div#page-5c4b76d0898583b89b348bb0>.row>.col>.row {
    padding-left: 3%;
}
}
/* Tablet */
@media screen and (min-width:641px) and (max-width:900px) {
div#page-5c4b76d0898583b89b348bb0>.row>.col>.row {
    padding-left: 3%;
}
}

or 

use flexbox

@media screen and (min-width:641px) {
div#page-5c4b76d0898583b89b348bb0>.row>.col>.row {
    display: flex;
    justify-content: space-between;
}
}

justify-content can be space-between or center or space-around

Edited by tuanphan

COVID-19Free priority support for all users (29/03 - 30/04). You can tag me (@tuanphan) or send to my email.

With paid support, see here

How to Setup Password & Share URL

 

Share this post


Link to post
  • 0
3 minutes ago, tuanphan said:

Have you tried Image Block yet? 

or style column 😄

Image Block doesn't provide the exact layout I need.

What is style column?

Share this post


Link to post
  • 0

Well, in typical squarespace fashion, it seems that editing the page results in breaking the div targeting. Can you tell me where to find the correct ID to update the CSS? I'm not sure what I'm looking for.

Share this post


Link to post
  • 0
6 minutes ago, mrjack16 said:

Well, in typical squarespace fashion, it seems that editing the page results in breaking the div targeting. Can you tell me where to find the correct ID to update the CSS? I'm not sure what I'm looking for.

I don't quite understand your question...


COVID-19Free priority support for all users (29/03 - 30/04). You can tag me (@tuanphan) or send to my email.

With paid support, see here

How to Setup Password & Share URL

 

Share this post


Link to post
  • 0

I removed the line blocks that were separating each section and it broke the CSS I just added so the new style is missing. Is it the the "div#page-5c4b76d0898583b89b348bb0" or  ".span-4" that changed? I don't know but I need to know how to update the CSS whenever I make changes to this page.

Share this post


Link to post
  • 0

I'm 99% there... one more question, how that I have the margin and padding where I want it, what's the preferred method of getting everything centered on the page?

Share this post


Link to post

Create an account or sign in to comment

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


×
×
  • Create New...