troubleshooting Question

custom twitter feed, css for each feed item

Avatar of axessJosh
axessJosh asked on
JavaScriptCSS
2 Comments1 Solution530 ViewsLast Modified:
I have found some code that generates a custom Twitter feed and it works great.  Only problem is that I cannot figure out how to create a custom background for each "tweet".

It currently applies my backgrounds to the entire listing, i've tried several options but can't figure it out.

My <div> code:
<div id="twitter_t"></div>
				<div id="twitter_m">
  				 <div id="twitter_container">
       					<ul id="twitter_update_list"></ul>
   				</div></div>
				<div id="twitter_b"></div>

My CSS:
#twitter_t {
   width: 300px;
   height: 25px;
   background:url(images/twitter_top.png) no-repeat top;
}

#twitter_m {
   width: 300px;
   padding: 0 15px;
   background:url(images/twitter_mid.png) repeat-y;
   
}

   #twitter_container {
       min-height:45px;
       height:auto !important;
       
       padding-bottom:10px;
	  
   }

       #twitter_update_list {
           width: 250px;
           padding: 0 0 10px 0;
           overflow: hidden;
           font-family: Georgia;
           font-size: 14px;
           font-style: italic;
           color: #31353d;
           line-height: 16px;
           font-weight:bold;
		   
		   
       }

       #twitter_update_list li {
           width: 250px;
           list-style: none;
		   margin-bottom: 15px;
		    
		   
       }

       #twitter_update_list li a {
           color: #5f6d76;
           border-bottom: dotted 1px;
           text-decoration: none;
		  
       }

       #twitter_update_list li a:hover {
           color: #31353d;
           background: #d3f1f9;
       }

		#twitter_b {
  		  width: 300px;
          height: 100px;
   		  background:url(images/twitter_bot.png) no-repeat bottom;
}

and the JS:

<script src="http://twitter.com/javascripts/blogger.js" type="text/javascript"></script>
<script src="http://twitter.com/statuses/user_timeline/REPLACE.json?callback=twitterCallback2&count=1" type="text/javascript"></script>

I understand how it is working but cannot figure out how to separate things out to where my 3 background images will be the top, middle and bottom for each individual tweet.  The source is showing that it outputs a <ul> and <li> tags for each tweet.

suggestions?
Join the community to see this answer!
Join our exclusive community to see this answer & millions of others.
Unlock 1 Answer and 2 Comments.
Join the Community
Learn from the best

Network and collaborate with thousands of CTOs, CISOs, and IT Pros rooting for you and your success.

Andrew Hancock - VMware vExpert
See if this solution works for you by signing up for a 7 day free trial.
Unlock 1 Answer and 2 Comments.
Try for 7 days

”The time we save is the biggest benefit of E-E to our team. What could take multiple guys 2 hours or more each to find is accessed in around 15 minutes on Experts Exchange.

-Mike Kapnisakis, Warner Bros