Jump to content

Portfolio Not Lining Up Correctly

Recommended Posts

Site URL: http://chasepickering.design

I have a portfolio website and I am having trouble aligning my content with my header and footer. I want the content to span the full 1200px of my website (line up with the header and footer) and retain the 3vw margin as it is resized. Would also like the left and right navigation arrows to line up with the footer. I have been messing with it for about 2 hours now and cannot figure out a solution. Hope I was clear enough and I would really appreciate the help! 

Screen Shot 2021-04-04 at 4.15.21 AM.png

 

Screen Shot 2021-04-04 at 4.23.25 AM.png

Edited by chspck
Link to comment
2 hours ago, chspck said:

Site URL: http://chasepickering.design

I have a portfolio website and I am having trouble aligning my content with my header and footer. I want the content to span the full 1200px of my website (line up with the header and footer) and retain the 3vw margin as it is resized. Would also like the left and right navigation arrows to line up with the footer. I have been messing with it for about 2 hours now and cannot figure out a solution. Hope I was clear enough and I would really appreciate the help! 

Screen Shot 2021-04-04 at 4.15.21 AM.png

 

Screen Shot 2021-04-04 at 4.23.25 AM.png

You mean like this

.item-pagination[data-collection-type^="portfolio"], .item-pagination[data-collection-type^="portfolio"] {
  max-width: 1200px;
    margin: 0 auto;
}

image.thumb.png.8289bdd3ff9c7bf090ac402e81edb681.png

BeyondSpace - Squarespace Website Developer

🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox)
🗓️ Delivery Date Picker (Squarespace Date format)
💫 Animated Buttons (Referral URL)
🥳 Sparkplugin Customisations Browsers (Browse +100 Spark plugin customisations)
🥳 Elfsight Template Browsers (Browse +1000 Elfsight widget Templates)

If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you!

 

Link to comment
15 hours ago, bangank36 said:

You mean like this


.item-pagination[data-collection-type^="portfolio"], .item-pagination[data-collection-type^="portfolio"] {
  max-width: 1200px;
    margin: 0 auto;
}

image.thumb.png.8289bdd3ff9c7bf090ac402e81edb681.png

Thank you for the response! Yes that worked for the footer, but on my homepage I am still having trouble lining up the content with the header and footer. See attached.

Screen Shot 2021-04-04 at 10.53.04 PM.png

Link to comment

Try adding to Design > custom CSS

/* align header - main content */
div#gridThumbs {
    padding-left: 0;
    padding-right: 0;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
5 hours ago, tuanphan said:

Try adding to Design > custom CSS


/* align header - main content */
div#gridThumbs {
    padding-left: 0;
    padding-right: 0;
}

 

That does work when the window is full size, but I would like to retain the 3vw margins as it gets smaller. See attached.

Screen Shot 2021-04-05 at 1.36.47 PM.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.