Code01 Posted November 23, 2021 Share Posted November 23, 2021 Site URL: https://www.jcatny.com/manga-artists I created blocks with HTML and CSS. At first it seemed working well, but when I released the page, the blocks' positions is not the same with the edit page. The position collapse.. Does anyone help me with this? HTML <p><div class="maste"> <span class="tape">SUPPORT 1</span> <fieldset style="background:#EECD77; border-radius:10px; font-size: 100%; padding: 15px; text-align:center "> <fieldset style="background:#00000; border-radius:10px; font-size: 130%; padding: 15px; text-align:center "><span style="color:#00000;"> <B style="color:#000000">オンラインで作品販売サポート</B></span> <fieldset style="background:#00000; border-radius:10px; font-size: 70%; padding: 12px; text-align: center "><span style="color:#00000;"> <br>毎月1度開催の“JCAT Gallery”では、SOLO展及びグループ展を開催しています。展示会での作品掲示では、作品を気に入ったファンが直接購入することができます。 </span> CSS <style> .maste { position: relative; background-color: #EECD77; box-shadow: 0px 2px 0px 0px #D4D4D4; background-size: 80px 80px; padding: 1em; } .tape{ position: absolute; top: -0.75em; background-color: rgba(255,255,255,.4); border-left:2px dotted rgba(0,0,0,.1); border-right:2px dotted rgba(0,0,0,.1); box-shadow:0 0 5px rgba(0,0,0,0.2); padding: 0.25em 2em; color: #65513f; transform: rotate(-3deg); } .maste p { color: #65513f; padding: 15px 10px 10px 10px; } </style> Beyondspace 1 Link to comment
Beyondspace Posted November 23, 2021 Share Posted November 23, 2021 8 minutes ago, Pero said: Site URL: https://www.jcatny.com/manga-artists I created blocks with HTML and CSS. At first it seemed working well, but when I released the page, the blocks' positions is not the same with the edit page. The position collapse.. Does anyone help me with this? HTML <p><div class="maste"> <span class="tape">SUPPORT 1</span> <fieldset style="background:#EECD77; border-radius:10px; font-size: 100%; padding: 15px; text-align:center "> <fieldset style="background:#00000; border-radius:10px; font-size: 130%; padding: 15px; text-align:center "><span style="color:#00000;"> <B style="color:#000000">オンラインで作品販売サポート</B></span> <fieldset style="background:#00000; border-radius:10px; font-size: 70%; padding: 12px; text-align: center "><span style="color:#00000;"> <br>毎月1度開催の“JCAT Gallery”では、SOLO展及びグループ展を開催しています。展示会での作品掲示では、作品を気に入ったファンが直接購入することができます。 </span> CSS <style> .maste { position: relative; background-color: #EECD77; box-shadow: 0px 2px 0px 0px #D4D4D4; background-size: 80px 80px; padding: 1em; } .tape{ position: absolute; top: -0.75em; background-color: rgba(255,255,255,.4); border-left:2px dotted rgba(0,0,0,.1); border-right:2px dotted rgba(0,0,0,.1); box-shadow:0 0 5px rgba(0,0,0,0.2); padding: 0.25em 2em; color: #65513f; transform: rotate(-3deg); } .maste p { color: #65513f; padding: 15px 10px 10px 10px; } </style> Are you mentioning these blocks, what's the problem on editor mode Greeting, it's BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Lightbox Studio pluginIf you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you Link to comment
Code01 Posted November 23, 2021 Author Share Posted November 23, 2021 Yes, that's right! Link to comment
Beyondspace Posted November 23, 2021 Share Posted November 23, 2021 26 minutes ago, Pero said: @bangank36 You can try adding to Home > Design > Custom Css to align your items #block-a3684d89ed8b801cd499 + .row .sqs-col-8 { width: 100%; } Let me know how it works on your site Press 👍 or mark this answer as solution to help another one too Greeting, it's BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Lightbox Studio pluginIf you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you Link to comment
Beyondspace Posted November 23, 2021 Share Posted November 23, 2021 My testing result Greeting, it's BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Lightbox Studio pluginIf you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you Link to comment
Code01 Posted November 24, 2021 Author Share Posted November 24, 2021 It worked! Thank you so much, @bangank36!!! Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment