CSS twitter sidebar widget

rebeccavassietrust · Member · Apr 3, 2017 at 11:18 am
Copy link

Add topic to favorites
I’ve added a twitter widget to the sidebar area on my website.

Unfortunately the name of our organisation (and therefore twitter account) is long (“Rebecca Vassie Trust”), but rather than missing out the end of our name as expected (e.g. “Rebecca Vass…”) – which is what happens on the Facebook widget – the name appears in full covering the twitter profile image.

The text over the image looks awful, and really unprofessional. I have tried editing the width of the widget but this doesn’t work. WordPress support suggested that there is a way to edit the widget through the code to fix this. Can anyone help?

The blog I need help with is: (visible only to logged in users)
otpidusprime · Member · Apr 3, 2017 at 11:33 am
Copy link
Hi,
It looks like there’s some initialization error with the twitter widget because when i add float: right CSS code to the name and remove it fixes the issue and changes the name to (Rebecca Vass…)

So, to solve this we have to force the name to appear like this (Rebecca Vass…) by changing the current CSS of the title which looks like this:
```
.TweetAuthor-name {
    font-size: 12px;
    line-height: 18px;
    font-weight: 700;
}
```
To this:
```
.TweetAuthor-name {
    font-size: 12px;
    line-height: 18px;
    font-weight: 700;
    width: 95px;
    position: absolute;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
```
Hope this helps :)

No items found.