I’m not able to check this until tomorrow, but something like
.rotatingtweet {
margin-bottom: 2em;
}
might work.
Aha! Hadn’t realised you were scrolling horizontally – but the CSS container is still .rotatingtweet
Is looks like you’ve fixed it? What was the solution you used?
No I haven’t fixed it yet! I’ve tried what you’re suggesting
.rotatingtweet {
margin-right: 20px;
}
but it just completely ignores the margin, keeping the tweets right after each other.
Any thoughts on what this might be?
What happens if you go with this?
.rotatingtweet {
padding-right: 20px;
}
Hmm that seems to just stretch the .rotatingtweet container, but doesn’t give me any space between the actual tweets…
There’s some code in the JavaScript that forces the size of the container.
What happens if you switch to version 2 of the Javascript?
First, when I did that, it kinda screwed up the rotation (something like horizontal and vertical happening together). I fixed that by switching the rotation type to scrollLeft.
It seems there’s a natural extra 20px margin to the right side in version 2 of Java, since the .rotatingtweets have 20px more width and there’s space between the tweets (I removed my CSS). However, I can’t make the space bigger or smaller with the CSS codes we’ve tried before. And there’s a small problem with the first tweet, which get’s pushed down about 10-20px and then pops back up when the slider starts moving. Very weird…
The first Tweet problem on version 2 of the JavaScript is the main reason I’ve not yet retired version 1!
What happens if you put the padding into .rtw_intents and .rtw_main?
Ah I see!
Yeah that last suggestion just pushes the content more in. Well, I like the lay-out as is, it would just be a bit pritier if there was space between the tweets. Maybe something for the next minor update?
I’ll see if it’s possible with a bespoke transition.
Cracked it.
Try the development version with version 2 of the JavaScript and change the Rotation Type to scrollLeftGap (if you’re using a shortcode) or ‘Scroll Left (with gap)’ (if you’re using a widget).
That has a gap of 100px. If you think it’s too big, let me know and we can try a smaller one.
Wow thanks, yeah that looks really nice! There’s one problem though, and thats that I suddenly loose the reply/favourite/retweet buttons. Their original div isn’t in the tweet anymore.
And of course there’s still the issue of the first tweet being pressed down, but I guess that’s a minor problem…
Aha! I think that’s the change of default. If you add show_meta_reply_retweet_favorite=1 it should reappear.
(Looks like I will have to change that option back!)
I think there may be a way to fix the first tweet problem, but that will take a bit longer. The issue is that the Tweet resizing only happens after the Tweets start to move.
A short term fix might be to go with something like:
div.rotatingtweet {
height: 95px;
}
Martin
I think it’s good to have the meta option, it’s easy to change with shortcode so that’s nice. So now it all works, thanks!
Unfortunately, the height option didn’t work. I don’t know what’s causing this. It also didn’t work when I’m forcing it with !important, it just ignores the div position and set’s off the content a couple of pixels to the bottom…
What about:
div.rotatingtweet.cycle-slide {
height: 95px;
width: 487px;
}
or even:
div.rotatingtweet.cycle-slide.cycle-slide-active {
height: 95px;
width: 487px;
}
