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

Search the Community

Showing results for tags 'full-width'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • Forum
    • News and Announcements
    • Getting Started With Squarespace
    • Coding and Customization
    • Commerce
    • Selling & Scheduling Your Services
    • Feedback on Your Site
    • Images and Videos
    • Pages and Content
    • SEO and Marketing
    • Site Design and Styles
  • Colorado Designers's Topics
  • Squarespace Forum Club Guidelines's Topics
  • Austin, TX Designers's Club Discussion
  • New York City Designers's Club Discussion
  • Berlin Designers's Club Discussion
  • SEO Experts's Club Discussion
  • Photographers's Club Discussion
  • Graphic Designers's Topics
  • London Designers's Topics
  • Podcasters's Club Discussion
  • Custom Coding Help's Club Discussion
  • Atlanta, GA Designers's Topics
  • Seattle, WA Designers's Topics
  • San Diego, CA Designers's Topics
  • Dallas, TX Designers's Topics
  • Australia Designers's Club Discussion
  • Minnesota Designers's Topics
  • Minnesota Designers's Topics
  • Copywriters's Topics
  • France Designers 🇫🇷's Topics
  • France Designers 🇫🇷's Topics
  • Portland, OR Designers's Topics
  • Canadian Website Designers's Club Discussion
  • Los Angeles Designers & Devs's Club Discussion
  • South African Designers's Club Discussion
  • Brazil Designers's Club Discussion
  • Developers's Club Discussion
  • German Circle Members's Topics

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


About Me


Website


Location


Badges


Expert ID

  1. Site URL: https://www.madebydot.tv/ @tuanphan My website is https://www.madebydot.tv/ If you have a look at the screenshot, the line spacing of the navigation menu is just so weird at the moment. I'd just like the line spacing between each page on mobile to be the same. Could you please help out? The other thing I was wondering was if I can make the project thumbnails and vimeo videos go full width only for mobile for my website?
  2. Hi all, How do I make a gallery carousel in a blog post fully bleed from left to right? This is what it currently looks like. The change will be applied to hundreds of blog posts so ideally the solution should not be block/collection specific. I want it looking like this below which seems to only work on a page. These are the options that comes under Slideshow Full with Full Bleed.
  3. Site URL: https://mcamediam.squarespace.com/teatro-gerolamo Hi Guys, I'm working on this website: https://mcamediam.squarespace.com/ted-x Client requested me that the video must be full width (just like the Home Page). I don't want to use YouTube to host every video for every project, so I'm asking you a line of CSS code to assure that every video for every case like these are in full width mode. https://mcamediam.squarespace.com/ted-x https://mcamediam.squarespace.com/pagani-mca-media https://mcamediam.squarespace.com/teatro-gerolamo How can I achieve that? Thanks, Dario
  4. Site URL: https://ecodefensegroup.org/ UPDATE*** Solution found. No one on upwork, here or stackexchange could figure it out. If anyone wants to have a banner video load on all mobile devices including iPhone 11 etc, I have a solution. It's lengthy. You may message me here for the solution. Background: Natively, the built in feature for background/banner videos is lacking. No matter what I tried I couldn't get any vimeo or youtube video to play or load on mobile phones, ipads etc. Our banner video loading on any website viewing device with internet is an absolute requirement.
  5. Site URL: https://chrisjeeves.com/ Hello, Apologies is this is covered elsewhere, I have looked on the forums and tried various custom CSS code injections with no joy. I'd like the video's on my site to all display full-width, they are currently much smaller than other content. There is a video at the top of this page with a red background for example (see crude drawing screenshot arrows): https://chrisjeeves.com/childrens-charity Video is embedded from You Tube with this code: <iframe width="560" height="315" src="https://www.youtube.com/embed/p0KHaJamWzw" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> The Square Space Template is: York If you need any of information please let me know Thanks in advance!
  6. Site URL: https://celery-chicory-nlez.squarespace.com/config/ Hello, I'm in the process of developing a one page website for a mindfulness app. The client would like the intro video to be full width with audio playing but the only way I know how to make video full screen is by adding a video background, but this does not play audio. Is there anyway to change this? Thank you, Ben
  7. Site URL: https://www.isadoreintimates.com/ Hi, I am trying to make my footer part of my full bleed image instead of below, but can't seem to work out how. This is my website: www.isadoreintimates.com, I dont understand what I am doing wrong ps. also only on the home page! not the other pages my template is Marta
  8. Site URL: https://www.metrichotel.com/home Hi everyone and @tuanphan, I am using Brine on 7.0 and for the life of me, I cannot get the index slideshow gallery to do a full bleed on any platform. Tried all sorts of settings and code I've found here, but nothing seems to work. Is this possibly a problem with the aspect ratio? I noticed that when using a few code snippets, the mobile view seemed to expand but had a black negative space on the bottom half of the screen instead of expanding the photo down. Thanks so much in advance!
  9. Site URL: https://www.goldenllamaproductions.com I would love for my demo reel video to be displayed like a full-bleed banner but with a play button and sound. I've seen it done before but cannot get it to work using the coding suggestions previously suggested in other discussions. Thank you!! https://www.goldenllamaproductions.com
  10. Hi, I am trying to make my eflsight widget become the full width of the website. The widget is the counter in the middle of the page where there are 5 different statistics. I tried using the following code below and for some reason it is not working. Can someone please help me solve this problem? Thanks! Website Link: https://alpaca-carrot-54zs.squarespace.com/chinesehome [data-section-id="610c6219b631287742b377e8"].content-wrapper { max-width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; }
  11. Site URL: https://flugelhorn-seahorse-lzrb.squarespace.com/config/pages/60aecc3b0856c07375a2e1c7?p Ok, so I hope its not painfully obvious but I dont know why this isn't a thing? I'm trying move my portfolio site from adobe portfolio over to squarespace. I have a long scrolling image I like (I've posted the example from old site) where you can just continuously scroll it But no matter how many ways i try to upload it, it just gets cropped. so is there any css or any way to stop this from happening. Or does any one know a workaround for how i could get this to work in this long image style? my site: https://flugelhorn-seahorse-lzrb.squarespace.com/config/pages/60aecc3b0856c07375a2e1c7?p pw: design
  12. Site URL: https://www.nicoleschuette.com I cannot get my full width banner to resize correctly in Mobile. I tried using focal points but it is not enough. I have very little coding experience and a designer put the home page together. Any advice on how to fix this so the home page image isn't cutting off but instead resizing? https://www.nicoleschuette.com Thank you!
  13. Site URL: https://scarlet-grape-g5ln.squarespace.com/ Hi there, I was looking for help with making a video full-bleed responsive with the website edge to edge. I also want it to work for both desktop and mobile. I have two examples running on my page right now. There was one where I am running it as a background video using BUT it wasn't centering properly. Part of it was being cut off by the header and it wasn't centering on the mobile properly either /* Section background image 16:9 video */ //show on mobile section.page-section[data-section-id="61019a7c2ef1a604d30e6b10"] { display:block !important; } // show on desktop html.no-touch section.page-section[data-section-id="61019a7c2ef1a604d30e6b10"] { display: block !important; top: 0 !important } section.page-section[data-section-id="61019a7c2ef1a604d30e6b10"] { //16:9 spacer padding-bottom: 56.25%; min-height: 0 !important; .section-background .sqs-video-background iframe { //make it the size of parent no matter what automatic JS it would like to do border-width: 0; position: absolute !important ; top: 60%; left: 60%; margin-right: 0%; transform: translate(-50%, -50%) } // blocks would be here but we won't have any .content-wrapper{ display:none !important; } } I was currently using this (a code of yours that I found in the past) in the CSS for the second version of the video underneath the one that is currently full-bleed /* Video fullwidth */ [data-section-id="6103292e6ee0aa3483fa6e22"] .content-wrapper { padding-left: 0 !important; padding-right: 0 !important; max-width: 100% !important; } Website: https://scarlet-grape-g5ln.squarespace.com/ P: doormat123
  14. Site URL: https://www.goldenllamaproductions.com/rhythms-of-peru-video Like so many others, looking for a custom code to all the videos on pages like this be a full bleed video with sound. NOT a background banner video. https://www.goldenllamaproductions.com/rhythms-of-peru-video I want it to work like this: https://www.tylerkalberg.com/work-samsung-gear-anybody Thank you for any help!!
  15. Site URL: https://doublevision.squarespace.com/ I'm trying to add a video that displays in full bleed. Currently I'm using the 'Video' option when choosing 'Add Section'. Currently working in in 7.1, and have not managed to make any of the CSS that people have provided out there work. An example of what I'm EXACTLY trying to achieve is the video that can be found by scrolling down in here: https://www.davidoscroft.com/polo-denim-fall-2019 Pass: DVTest
  16. Site URL: https://clownfish-coral-haax.squarespace.com/ Hi everyone, I am trying to make a simple hover over feature that changes one image to another. I managed to code that much, but as you will see on the site there, it is set in with awkward margins... Im trying to get it to be full bleed..... any help would be greatly appreciated! See my CSS code attached--- Thanks, Anthony
  17. Hi there! I am working up a trial site (so not available right now) and I have set up some CSS code for a full-width video player. It looks and works great, but has a little bit of padding on the top and bottom - despite setting that to 0px. See below: [data-section-id="60e4534485053e2e8634f482"]{ overflow-x: hidden !important; overflow-y: hidden !important; .content-wrapper { padding: 0px !important; margin: 0px auto; display: contents; } } #player { padding-bottom: 0px !important; padding-top: 0px !important; } It's an issue because the section below it is a different color so it stands out. And when I set the video section to that same color, it has the small line at the top. Any help is appreciated! Thanks!
  18. Site URL: https://www.naturalbornorganizers.com/welcome The background images on the homepage move while on mobile. I don't see it inside of the SS viewport, but I notice it on my phone. Address: https:www.naturalbornorganizers.com/welcome
  19. Site URL: https://imgur.com/a/yoEoMPO How can I create a full-bleed/fullwidth portfolio page? I am trying to remove all boarders, but there doesn't seem to be a setting for this.
  20. I am trying to make a video block full width on a brine template. I tried the code posted here but it didn't work for me.
  21. Site URL: https://apple-cobalt-rm97.squarespace.com/ Hi! I am trying to have images full bleed in a grid (see images below) with copy below each image. I have somewhat achieved that however the larger image doesn't stay aligned to the bottom of the other images as it scales. The code I used is below. Does anybody have any ideas of how to fix this or a better idea of how to achieve the overall look in general? The images will be links to the programs. I am also having trouble with the text below needing a bit of padding on the left, mainly on the larger image and also making the leading tighter just on this section. Thanks! ////// PROGRAMS HOME PAGE ////// // text no padding // #block-yui_3_17_2_1_1621910892795_30376, #block-yui_3_17_2_1_1621910892795_25128, #block-yui_3_17_2_1_1621910892795_26488, #block-yui_3_17_2_1_1621910892795_29021, #block-yui_3_17_2_1_1621910892795_27755 { background: #000000; padding-bottom: 0px; padding-left: 20px; text-align: left; } // Image no padding // #block-yui_3_17_2_1_1621910892795_10252, #block-yui_3_17_2_1_1621910892795_11420, #block-yui_3_17_2_1_1621910892795_16220, #block-yui_3_17_2_1_1621910892795_19896, #block-yui_3_17_2_1_1621910892795_22882 { padding: 0px; } // Full Width Image Card Page Section // section[data-section-id="60ac50915a700a0d77d5774d"] { overflow-x: hidden !important; overflow-y: hidden !important; .content-wrapper { padding: 0px !important; margin: 0px auto; display: flex; display: contents; } .sqs-layout .sqs-row .sqs-block { padding-bottom: 25px !important; padding-top: 8px !important; }}
  22. Site URL: https://keyboard-jaguar-k52z.squarespace.com/ Hi there, I'm trying to achieve this effect: when clicking on the search icon in the header, it opens a full screen window where to type the search and where the search results are shown. Something like this: https://pauliandsisters.com/search This is the website I'm working on: https://keyboard-jaguar-k52z.squarespace.com/ Password: tpt-2021 Thanks in advance for your help!
  23. Site URL: https://www.craftedfestival.com.au/ Hi guys, I've been doing some serious CSS hacking trying to get a wave graphic to sit over my banner images on the Brine Template. I've managed to add the image to every page, however the site has 30px of padding site wide. To get the image to be full width, I've added a -30px margin to the left but then the banner stops short on the right as the width isn't long enough. To overcome this, I've tried making the wide 100% + 30px but for some reason this extends the graphic outside of the website container and makes a horizontal scroll bar for about 200px! So now I've got the width set to 103% which works on some screen sizes, but either goes past site boundary on extra large widths, and falls short on mobile. Any ideas on how to get the wave graphic to just fit perfectly at 100% of the page but not within the site padding boundary?? /*Add wave to banner images*/ #block-yui_3_17_2_1_1620107629754_2747{ overflow: visible; &:before { content: ''; width: calc (100% + 30px); height: 100px; background-image: url(https://static1.squarespace.com/static/58a18e6da5790a7c3fcaaf73/t/6090a1cb6f648c6378f7640d/1620091339242/Image-wave.png); position: absolute; margin-top: -100px; margin-left: -30px; } }
  24. Site URL: https://stennar-martinson.squarespace.com/config/design/custom-css Hello. I need to reduce the margins on the side of my content/ make my content wider. I use the Adversary template in the Marquee family, now discontinued. This template does not offer padding or site width adjustments. CSS for this would be very appreciated 🙂
  25. I have a patch job solution for this, but want to know if there's a better way I can do this. For this gold, and green section, I simply have a background photo that is half gold and half green. It creates a cool look on desktop, but then, as one would expect, on mobile it looks kind of silly, where the stacked text overlaps the gold and green. Maybe an easy solution for this would be to use CSS to just remove the image for mobile, so it would default to the solid color? Seems like it'd be a simple solution, but not sure how to do this. Can someone help?
×
×
  • Create New...