Move logo on Twitter box

• 

  julianatiraboschi · Member · Mar 17, 2017 at 8:14 pm

  • Copy link
  • Add topic to favorites

  Hi! I’d like to move my twitter logo to the left in the sidebar on the right so it’s not beneath the text. Could someone help me with that code?

  Thanks a lot!

  The blog I need help with is: (visible only to logged in users)

• 

  julianatiraboschi · Member · Mar 17, 2017 at 8:20 pm

  • Copy link

  Also, the text on this box is cut. how can I make the box wider?

• 

  thesacredpath · Member · Mar 17, 2017 at 10:46 pm

  • Copy link

  Hi, in your custom CSS, replace what you have with the following two CSS rules.

  .active-sidebar-primary-sidebar #page,.page-template-nosidebar-page-php #page {
  	max-width:820px;
          width: 100%;
  }
  .widget-area {
  	max-width: 200px;
  	width: 100%;
  }

  Pachyderm is a responsive width theme that adjusts to all screen/window widths, so we typically would not specify a width in static units such as
  width: 820px;
  since that would not allow the element to adjust in size for differing window/screen widths. Generally widths are either set as a percentage, or a max-width is set and then a width of 100% which will keep the element as wide as it can be, up to that max-width value.
  Pachyderm

• 

  thesacredpath · Member · Mar 17, 2017 at 10:47 pm

  • Copy link

  I didn’t mention it, but the second CSS rule I have in the above takes care of the sidebar Twitter widget issue.

• 

  julianatiraboschi · Member · Mar 17, 2017 at 11:02 pm

  • Copy link

  Hello, it totally worked for the sidebar width, thanks a lot!

  But the Twitter elements are still overlapping, even with the second rule. Any idea how to fix it?

• 

  thesacredpath · Member · Mar 20, 2017 at 6:45 pm

  • Copy link

  Hi there, I had to pull in one of our developers and we found the twitter widget code from twitter has a 220px minimum width, so we need to widen everything by another 20px. Replace what you have with this.

  .active-sidebar-primary-sidebar #page,.page-template-nosidebar-page-php #page {
  	max-width:840px;
  	width:100%
  }
  .widget-area {
  	max-width:220px;
  	width:100%
  }

  In our testing, that seems to fix the issue. Test on your system and let me know if you see anything weird.

• 

  julianatiraboschi · Member · Mar 22, 2017 at 1:39 am

  • Copy link

  Thats genious, it worked! Thank you very much for your help. Regards, Juliana.

• 

  thesacredpath · Member · Mar 22, 2017 at 3:34 am

  • Copy link

  Juliana, you are welcome.