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

Search the Community

Showing results for tags 'responsiveness'.



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

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

Found 3 results

  1. Hello everyone, So my problem is when i go into responsive mod my buttons are off the screen and it's not normal. I made a custom css profile to have all the buttons with the same size but now they are not responsive ! The other problem is my custom design buttons that i made in png and integrated them as a image. But in responsive mod they are huge ! Thank you for the help ! Here is my css : /* Remove underline from links */ a { border: none !important; } body p, .sqs-layout .sqs-block.html-block p { text-align: justify !important; } .field-list { .form-item select { background-color: #fafafa; }} .sqs-lightbox-next, .sqs-lightbox-previous, .yui3-lightbox2 .yui3-lightbox2-content { pointer-events: none; } .sqs-lightbox-close { pointer-events : auto; } #nouvelle-page-1 { background: #7E66A5 } .markdown-block p { margin-left:1.5em; } .markdown-block .ui-closed:before { font-family:monospace; content:"★ "; } .markdown-block .ui-open:before { font-family:monospace; content:"☆ "; } .sqs-announcement-bar-text p { text-align: center !important; } .image-block-collage-text-alignment-left .sqs-block-image .design-layout-collage .image-card>* { text-align: center !important; } .sqs-widgets-audio-player.dark { background: #8067a6; } .sqs-announcement-bar { background: linear-gradient(99deg, #ac96ce, #392345); background-size: 400% 400%; -webkit-animation: AnimationName 3s ease infinite; -moz-animation: AnimationName 3s ease infinite; animation: AnimationName 3s ease infinite; } .sqs-announcement-bar-text { -webkit-animation: AnimationName 3s ease infinite; -moz-animation: AnimationName 3s ease infinite; animation: AnimationName 3s ease infinite; } @-webkit-keyframes AnimationName { from{color:0% !important;background-position:0% 51%} 50%{color:50% !important;background-position:100% 50%} to{color:100% !important;background-position:0% 51%} } @-moz-keyframes AnimationName { from{color:0% !important;background-position:0% 51%} 50%{color:50% !important;background-position:100% 50%} to{color:100% !important;background-position:0% 51%} } @keyframes AnimationName { from{color:0% !important;background-position:0% 51%} 50%{color:50% !important;background-position:100% 50%} to{color:100% !important;background-position:0% 51%} } @-webkit-keyframes AnimationName { from{color:0% !important;background-position:0% 49%} 50%{color:50% !important;background-position:100% 52%} to{color:100% !important;background-position:0% 49%} } @-moz-keyframes AnimationName { from{color:0% !important;background-position:0% 49%} 50%{color:50% !important;background-position:100% 52%} to{color:100% !important;background-position:0% 49%} } @keyframes AnimationName { from{color:0% !important;background-position:0% 49%} 50%{color:50% !important;background-position:100% 52%} to{color:100% !important;background-position:0% 49%} } .sqs-use--icon { fill: #8067a6 !important; } .Index-page-scroll-indicator-arrow { stroke: #none ; opacity: 0; } .sqs-block-button .sqs-block-button-element { width: 350px; } @media only screen and (max-width:1400px) { #collection-5cda8559cb2c42000142030b section#le-conseil-1 .sqs-col-4 { width: 100% !important; } } @media only screen and (max-width:1400px) { #collection-5ced2159e79c7041acd8b198 section#accueil-1 .sqs-col-4 { width: 100% !important; } } @media only screen and (max-width:1400px) { #collection-5d1c71e5cd79fe00013bc949 section#la-formation-1 .sqs-col-4 { width: 100% !important; } } @media only screen and (max-width:1400px) { #collection-5d1c72071e661a0001ce3151 section#le-recrutement-1 .sqs-col-4 { width: 100% !important; } } @media only screen and (max-width:1400px) { #collection-5dd3f8cfb16d2c02ed717542 section#mdias- .sqs-col-4 { width: 100% !important; } }
  2. On the mobile version of my site I have used some code to reduce the size of my images. However the following content hasn't moved up the screen into the new space. I would also like the image centred on mobile. https://apricots-lute-e75n.squarespace.com/packages Password: albert
  3. I would like to create a responsive div table on my website. Here is the code I'm currently using: <style type="text/css"> .table { display: table; background-color: #fb782d; } .row { display: table-row; width: 100%; } .column { display: table-cell; vertical-align: middle; text-align: center; padding: 20px; width: 20%; border-right: 1px solid white; } .row a { color: #fff !important; } .row a:hover { color: #363636 !important; } </style> <div class="table"style="width:100%"> <div class="row"> <div class="column"><a href="#pharma">Pharmaceuticals</a></div> <div class="column"><a href="#med">Medical Devices & Diagnostics</a></div> <div class="column"><a href="#health">Consumer Health & Over-the-counter (OTC)</a></div> <div class="column"><a href="#logistics">Pharma Asia-Hub Logistics</a></div> <div class="column"><a href="#sol">Specialised Solutions</a></div> </div> </div> Does anyone have any advise? Thanks!
×
×
  • Create New...