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

Change Size of Twitter block on Mobile


viccismarshall

Question

Site URL: https://pumpkin-harp-dd4x.squarespace.com/

Hi everyone,

Just trying to figure our if there any way of making the Twitter block smaller on mobile? I have customised the bullet points for the site, but that means that the Twitter block now is too big for the mobile page. If not, is there a way to exclude the twitter block from the custom bullet points?

Thank you in advance to anyone that could point me in the right direction!

Password is oneadvisory

 

mobile twitter off screen.png

Link to comment
  • Answers 10
  • Created
  • Last Reply

Top Posters For This Question

10 answers to this question

Recommended Posts

  • 0
On 3/28/2020 at 2:04 AM, tuanphan said:

How did you create the bullet?

if you used CSS, wrap CSS in the below code


@media screen and (min-width:641px) {
paste your CSS here
}

 

This is brilliant!!! Thank you so much! Works perfectly - the only thing is that now all the other custom bullet points disappear on mobile - is there any way of just affecting the twitter block? Sorry and thank you!

Edited by viccismarshall
Link to comment
  • 0
3 minutes ago, viccismarshall said:

This is brilliant!!! Thank you so much! Works perfectly - the only thing is that now all the other custom bullet points disappear on mobile - is there any way of just affecting the twitter block? Sorry and thank you!

Which code did you use?

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0
2 minutes ago, tuanphan said:

Which code did you use?

@media screen and (min-width:641px) {
ul {list-style-type: none;}
ul[data-rte-list] li>*:first-child::before 
{content: " " !important;}  
ul li:before{
content: '';
display:inline-block;
background-image: url(https://static1.squarespace.com/static/5d8c929f2d89533d477b026f/t/5e60fc963720b572b5ccc364/1583414422430/OA+BUllet+Point.png);
background-repeat: no-repeat;
background-size: 20px;
background-position: center;
width: 20px;
height: 20px;
position: absolute;
margin-left: -25px;
margin-right: 5px;
margin-top: 5px;
margin-bottom: 0px;
  }}

Link to comment
  • 0

use

@media screen and (min-width:641px) {
div#page-5d938f39e29d4d5342072e38 {
    ul {list-style-type: none;}
    ul[data-rte-list] li>*:first-child::before 
      {content: " " !important;}  
      ul li:before{
      content: '';
      display:inline-block;
      background-image: url(https://static1.squarespace.com/static/5d8c929f2d89533d477b026f/t/5e60fc963720b572b5ccc364/1583414422430/OA+BUllet+Point.png);
      background-repeat: no-repeat;
      background-size: 20px;
      background-position: center;
      width: 20px;
      height: 20px;
      position: absolute;
      margin-left: -25px;
      margin-right: 5px;
      margin-top: 5px;
      margin-bottom: 0px;
        }
	}
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0
9 minutes ago, tuanphan said:

use


@media screen and (min-width:641px) {
div#page-5d938f39e29d4d5342072e38 {
    ul {list-style-type: none;}
    ul[data-rte-list] li>*:first-child::before 
      {content: " " !important;}  
      ul li:before{
      content: '';
      display:inline-block;
      background-image: url(https://static1.squarespace.com/static/5d8c929f2d89533d477b026f/t/5e60fc963720b572b5ccc364/1583414422430/OA+BUllet+Point.png);
      background-repeat: no-repeat;
      background-size: 20px;
      background-position: center;
      width: 20px;
      height: 20px;
      position: absolute;
      margin-left: -25px;
      margin-right: 5px;
      margin-top: 5px;
      margin-bottom: 0px;
        }
	}
}

 

Hello,

Thanks so much for helping! When I add in the extra part, it seems to take away all of the other custom bullet points on both desktop and mobile as well as the Twitter block? Sorry!

before.png

After.png

mobile.png

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...