Search the Community
Showing results for tags 'margin'.
Found 49 results
-
Site URL: http://www.eoghannolan.com/ I'm trying to get the gif at the top of this page to look like a news ticker, so it needs to be full width and flush with the header and the section below. The width should scale down with the screen size and the height should be relative to the width - apologies my understanding of css is limited.
-
Site URL: http://www.lisaeggleston.com After inspecting the code for the main page of my site, I found that I have a bunch of empty space between the title and the body content due to - element.style { margin-top: 241px; } In the inspect module, when I change 241px to 0px, it's perfect, but I can't seem to translate that to my CSS insert. Since this is just the whole page and not a block, I'm not sure how to identify it. I've tried main-site, main, site, site-page, body... 😞
-
Site URL: https://www.domaniquejazmindesigns.com/ Hi all! Is anyone able to help me come up with some coding to change the left & right margins on my image:card blocks for mobile? I know there is a slider to change this in site styles but I actually like the way it looks on desktop, just not happy with the extra spacing on mobile view.
-
Hello, The external margin of the homepage and other projects pages isn't the same dimensions. I don't understand how i can the same dimensions of external margin for each pages. Someone can help me ?? Thank you
-
Site URL: https://www.billelis.com/products Hello guys, hope you are well. so i been trying for ages to fix this and im failing big time. I simply want the product page and the blog summary page to be full size and fill the screen like my gallery pages on my website. Huge thank you for your help.
-
Site URL: https://www.louissutherland.com I'm trying to increase the width of the page content so that the videos appear larger depending on the person's browser window (increasing or decreasing in size according to full the space accordingly. Right now the content feels very narrow with big borders/margins on the left and right. -
Site URL: https://smilodon-ocelot-my5f.squarespace.com/desert-modern-home Hi, Would it be possible to create this page? (see my mock-up below) I'd like to keep the slideshow in the link provided (not a flat single image) and add the text and buttons over the top. Then make sure the image margin matches the header.
-
Targeting image in css for extra padding/margin
Handford posted a question in Coding and Customization
Site URL: https://www.handford.com/ hi there, experiencing some image padding issues for certain iphone models - in this case, the iphone x i just wanna add some padding to that text image 'handford creative represents...' tried to target all elements on mobile page but didn't work. please help! thanks! -
Site URL: http://https/fullcirclemicrobes.com/problem-solution-1 For each new page or section I create within my site index, there's a built-in padding or margin at the top and bottom that runs the width of the screen. I've looked at a few similar questions and tutorials on YT but haven't been able to make those CSS fixes work for me. In this particular example, I want to eliminate the grey areas above and below my text blocks so that the section/page will be divided in half vertically with the left side all grey and the right side all green. -
Site URL: https://k2.life I have about 8 image blocks next to one another. I want to make them so that they stretch out across the whole page section so that they fill in the blank space. If you navigate to my site it is the "Some of Our Recent Customers" section that I am referring to. Here is my current code that at least removes the padding, but I cannot seem to make them fill in the blank space from left to right. #block-yui_3_17_2_1_1595186156795_32170,#block-yui_3_17_2_1_1595186156795_33500, #block-yui_3_17_2_1_1595186156795_35306, #block-yui_3_17_2_1_1595186156795_39012, #block-yui_3_17_2_1_1595186156795_59689, #block-yui_3_17_2_1_1595186156795_58146, #block-yui_3_17_2_1_1595186156795_56616, #block-yui_3_17_2_1_1595186156795_40813 { margin: 0 auto; padding: 0px !important; max-width:1900px !important; } -
Site URL: https://pufferfish-lion-mkrm.squarespace.com/ I am using the Nolan template. To display a full width video with no padding on top so it sticks on top of the section, what code do I need to inject in the css ? I tried some code and it seems ok-ish but not sure. For the padding on top it seems in particular challenging for mobile, think I need some more specific code there. General site-spacing I am using: Page-width max: 2400px Page Margin: 2vw Besides the video I would like to adapt another section with image-stacks to full width images on the mobile version of my site. Which CSS code should I use for both video and images to be make it look perfectly smooth? Also right now I'm addressing all videos in the code, but how can I address specifically the video in section two ? code I used: .sqs-block-video { padding: 0 !important; width: 110%!important; margin-left:-4vw!important; margin-right:-4vw!important; margin-top:0!important; } .page-section:nth-child(2) .content-wrapper { padding-top:0!important; } @media screen and (max-width: 640px){ .sqs-block-video { padding: 0px !important; z-index:99!important; width: 110%!important; margin-left:-5%; margin-top:-5%!important; } } Hope you guys can help 🤞
-
Site URL: https://www.weareteller.com I'm trying to have images overlap different sections like the attached image. Using negative margins I can get it to move outside the container, but don't know how to get it to overlap.
-
Site URL: https://www.studiorhodes.net/services Hello, For some reason the page margins seem to get narrower the farther down I scroll on my page. However, when I am in the edit mode, this is not the case. Only have I press save and view the page at a whole does this happen. Any ideas why? Website URL: studiorhodes.net/services Password: services -
Reduce padding on Instagram block in footer
TomKnowsNoCSS posted a question in Coding and Customization
Site URL: https://www.boutique14.co.uk/home1 Hi, I'm trying to reduce the padding between the Insta block in the top footer and next section of top footer beneath it. See attached image. Tried messing around with CSS on that block and the one underneath but can't get it to work. Help gratefully received. Thank you. Tom www.boutique14.co.uk/home1 -
On my website, I have placed full page-width images and a colored footer that also spans the page width. However, when I scroll to the right of the page, there is a white stripe/margin space on the right that was originally out of view. Does anyone know why this extra space is on the website, and how to remove it? -
Site URL: https://earthworm-crow-7c2p.squarespace.com/ Hey! I need some help! I need to change the margin of a SINGLE image block on my MOBILE view only. Can anyone help! See image of mobile preview
-
I am using the Bryler template and have a single index page for my site that holds all of the content pages within it. I am trying to create a scenario where the first page of the index has different padding (top and bottom margins) than the rest of the pages within the same index. In other words, can I adjust the padding of a single page within an index without affecting the others? Let's say my index is named "welcome" and the first content page under that is called "home". I found this code on another thread, but cant seem to assign the page names properly... section#video .Index-page-content { padding-top: 20px; padding-bottom: 20px; } I tried using "welcome#home" and "home#welcome", but neither worked. I'm sure I'm missing something simple, as a very inexperienced coder. I'm hoping some one can help me out. Thanks so much.
-
Removing the Margin of an image for Mobile View
Dtcforce posted a question in Coding and Customization
Site URL: http://dtcforce.com Hi, I have built my website on squarespace 7.1. For some reason the images on the homepage the margin is going beyond the screen because of this the screen in mobile is moving to the right when navigating Attached is an image for reference -
Site URL: https://humbeeshop.squarespace.com/ Home page: https://humbeeshop.squarespace.com/ Product page: https://humbeeshop.squarespace.com/shop/hand-sanitizer-disinfectant-gel-169oz50ml-packs-of-61224 PW: 2020 Hi I am wondering why above two page display different margin width? I checked the CSS style and they are all "auto 0" and with padding 4vw. But you can see the actual margin width differs a lot. How can I adjust the product to be as same as the homepage margin? -
Increase margin / padding to sides of images
TomKnowsNoCSS posted a question in Coding and Customization
Site URL: https://www.boutique14.co.uk Hi, How can I introduce some space to the sides of the three images on my homepage? See red squiggles on attached screenshot. When I use spacer blocks the images resize and I can't get them all the same size again. I can't re-size the spacer blocks sufficiently to make it work (there's a minimum width). Is there either some CSS to make spacer blocks more width adjustable or some other way I could put a margin or padding around those three images to bring them in a little? Thanks. -
Site URL: https://www.boutique14.co.uk/ When viewed in the Facebook mobile app in-built browser my site has a strange border on the right hand side. I can't see what could be creating this, there are no borders set on my site. On Safari and other mobile browsers it looks normal. I attach two screenshots, one showing what the Facebook app does with my site, the other showing how it should look (on Safari in this example). Any ideas? Thanks.
-
Site URL: https://www.mattportch.com/lost-america-prints Hi, How do I get the text at the bot tom of this page to align with the margin? (I've already added this page code for the current margin to contain the other elements): <style> @media (min-width: 768px) { header#header, .content-wrapper, .section-background { padding-left: 9% !important; padding-right: 9% !important; }} </style>
-
Site URL: https://bernardandhawkes.com/new-england-insider-favorites Hi, I am trying to tighten up the spacing in between elements on my masonry blog layout, I have reduced the spacing within the SquareSpace custom section, but there appears to be margin being added in the code. How can I remove this? I have tried multiple different selector options and nothing is changing it. Thanks!
-
Site URL: https://smilodon-ocelot-my5f.squarespace.com/ Hi, I've added padding to my site in DESK view. However, I've found that somewhere between DESK and MOBILE view, the padding changes and adds extra space to the header. Does anyone know if there is a way to keep the header (logo and nav icon) aligned to the image? pass: trythis Below are landscape and portrait ipad views...
-
7.1 blog - masonry margin, padding display problem
SKYW4KR posted a question in Coding and Customization
Site URL: https://tambourine-orca-xhby.squarespace.com/news I am attempting to style my 7.1 blog summary using a masonry grid and inspired by the old Tudor template. While I've successfully laid out the elements pretty closely (and even accounted for the mobile nuances, the unfortunate side effect is that all the content blocks are overlapping each other when the page is loaded ... However, if i make any change to my browser window size, it will re-shuffle the content and render it correctly ... check out the page here ... https://tambourine-orca-xhby.squarespace.com/news password: 1234 I hope I don't have to ditch all the work I put into it? /* add a little margin to top of section */ .blog-masonry-wrapper { margin-top: 50px; } /* display block and positioning for title */ .blog-masonry-wrapper .blog-title { background-color:#fff !important; padding: 50px 30px 40px 30px; margin-top: -40px } /* center date element */ .blog-meta-section { width:100%; text-align:center; } /* date element styling */ .blog-masonry-wrapper .blog-date { background-color:#000 !important; position: fixed; z-index: 99; width: 80px; height: 15px; padding: 32.5px 0px; margin-top: -51px; margin-left: -40px; font-family: 'Roboto' !important; font-weight: 600 !important; font-size:0.8em !important; text-align:center; color:white !important; border-radius: 40px; } /* hide secondary meta info */ .blog-masonry-wrapper .blog-author { display: none !important; } what have I missed? Thanks in advance! -lh
