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

Search the Community

Showing results for tags 'container'.



More search options

  • 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
    • 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

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

Found 5 results

  1. Site URL: https://echidna-gardenia-fcb4.squarespace.com/ I have made a blog post template using Image Blocks, however I am keen to have unconstrained image heights for each blog post so viewers can see the full image. When in editing mode, the images appear with set widths and different heights (which is what I want). However, when viewing the desktop version and mobile versions, the Image Blocks become constrained, cropping each image to fit within the same height box. I have tried altering the container size, image block heights and overflow, however none of these tweaks are working. Examples below and any help would be greatly appreciated! Thank you! Editing Mode - how I would like the images to display using different heights: How images are displaying in the desktop and mobile versions - all constrained in set squares:
  2. Here is a partial screenshot - in edit mode, hovering the mouse over a single image shows extra space on the bottom. The blue container is uniform on the sides and top, but not the bottom. Here is what's currently enabled in the image-edit Design mode: - Inline Image - Captions are turned off - Image is stretched to span the container - Every and all combination (to my knowledge) of these Design choices does not resolve the problem. I'm guessing some code can get rid of it - any ideas?
  3. Hey all, I am trying to create a specific effect for my website. I have an image and on Hover I would like to display a black overlay on slight transparency+some text formatted in a specific way. I tried to do it with the Squarespace default way but I couldn't manage so I tried to use the HTML+CSS customization but still I am struggling. Something with the way I am specificing the text size based on the vw is breaking things. Any help? Adding video and image This is the CSS .container { position: relative; width: 50%; } body { font-size: calc([minimum size] + ([maximum size] - [minimum size]) * ((100vw - [minimum viewport width]) / ([maximum viewport width] - [minimum viewport width]))); } .image { display: block; width: 100%; height: auto; } .overlay { position: absolute; top: 0; bottom: 0; left: 0; right: 0; opacity: 0; transition: .5s ease; padding: 2vw; background-color: rgba(0,0,0,0.7); } .container:hover .overlay { opacity: 1; } .Title { color: white; font-size: 5vw; position: relative; text-align: left; } .SubTitle { color: white; font-size: 3vw; position: relative; text-align: left; } .Synopsis { color: white; font-size: 2vw; position: relative; margin-top:30%; text-align: left; } .credits { color: white; font-size: 1.8vw; position: absolute; bottom: 0.5vw; text-align: left; line-height:70% } .overlay {color: white;} This is the HTML file <!DOCTYPE HTML> <html> <head> <meta charset="UTF-8"> <title>Passione</title> <link href="../css_sheet.css" rel="stylesheet"> </head> <body> <div class="container"> <img src="passione.png" alt="Avatar" class="image"> <div class="overlay"> <div class="Title"> Passione </div> <div class="SubTitle">a John Turturro Film</div> <div class="Synopsis"> <p><p><strong>Synopsis</strong><br></p> <p>Filmed in Naples, Italy, Passione is the fourth film directed by John Turturro and released in the United States in June 2011. The movie chronicles the rich world of contemporary Neopolitan music tracing the influences of European, African and Arabic cultures in a wild, colorful and sexy musical adventure. Passione was present at the 67th Venice International Film Festival, won the Capri Cult Movie Award, the &ldquo;Movie film festival of Salerno&quot; and the City of Loano prize.;</p> <p><br></p> </div> <div class="credits"> <p><strong>Director:</strong> John Turturro</p> <p><strong>Role:</strong> Production Coordinato</p> <p><strong>Release:</strong> June 22nd 2011</p> </div> </div> </div> </body> </html> Screen Recording 2020-08-08 at 14.18.52.mov
  4. Hi, Im using the medium width setting for all content on my site. When I embed a widget from Elfsight, set to display in full width, it stops scaling with the rest of the content after around 950 px. Does anyone know what may cause this issue? Im very thankful for some help here. Thanks, M
  5. Site URL: https://jimgoldberg.fr/ Hi, Everytime I click on any clickable element of my website a thin dotted line surrounding the object appears. (image attached) Would anyone know how to remove it using css codes ? Thanks in advance for you help 🙂 WEBSITE PASSWORD : Segura70
×
×
  • Create New...