CSS for embedded Tweets
An embedded Tweet appears on your page as a <blockquote> with the cited text of a Tweet; this markup is later interpreted by Twitter for Websites code to render a full embedded Tweet. The <blockquote> HTML is available in all rendering environments, including RSS feeds and email updates.
An embedded Tweet’s fallback markup will inherit the CSS rules already applied to <blockquote>, <p>, and <a>HTML elements on your webpage.
Sunsets don't get much better than this one over @GrandTetonNPS. #nature #sunset pic.twitter.com/YuKy2rcjyU
— US Department of the Interior (@Interior) May 5, 2014
blockquote.twitter-tweet {
display: inline-block;
font-family: "Helvetica Neue", Roboto, "Segoe UI", Calibri, sans-serif;
font-size: 12px;
font-weight: bold;
line-height: 16px;
border-color: #eee #ddd #bbb;
border-radius: 5px;
border-style: solid;
border-width: 1px;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
margin: 10px 5px;
padding: 0 16px 16px 16px;
max-width: 468px;
}
blockquote.twitter-tweet p {
font-size: 16px;
font-weight: normal;
line-height: 20px;
}
blockquote.twitter-tweet a {
color: inherit;
font-weight: normal;
text-decoration: none;
outline: 0 none;
}
blockquote.twitter-tweet a:hover,
blockquote.twitter-tweet a:focus {
text-decoration: underline;
}