Twitter widget stuck in upper left corner

[BradNoeMusic]

Hello. I’m using CSS to format a site. I’d like the twitter feed to be positioned basically in the middle of the page. No matter what code I add, the widget is stuck above another widget on the page. I’m rather confused why.

Here’s the CCS code:

.twitter-timeline {
   position: absolute
   left: 550px;
   top: 300px;
   width:300;
   height: 200;
}

and the widget:

<div class="twitter-timeline" 'href="https://twitter.com/BradNoeMusic" data-widget-id="678692419626401792">Tweets by @BradNoeMusic</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>         
</div>

Anything obvious you can see?

I haven’t published the page yet, but intend to soon.

thanks for your help.
Pamela

[BradNoeMusic]

I see the widget code didn’t post. When I get the page up, I’ll post the link.

[BradNoeMusic]

http://www.pameladevine.com/brad_noe_calendar1366x768.html

[andypiper]

You need to use the code markup to make the code visible (either use the </> in the editor, or surround the code blocks with backticks) - I fixed that for you.

[benward]

Hi Pamela,

Best guess here is just that you need to set the z-index of your widgets appropriately to get the stacking you want: Try z-index: 10 on the .twitter-timline selector, and z-index: 20 on the widget you want to appear over it.

(Also, note that you’re missing px units on your width/height in the example above, that will result in the widget appearing at its default 520px/600px dimensions.)

Hope that helps,

Ben

[niall]