Majordojo

Atom CSS Stylesheet

Feeds were never designed to be consumed by humans. They were meant to be processed by machines. That is why feeds are in XML. However, many Internet users find themselves one way or another looking at the XML of a feed (often when they are attempting to subscribe to the feed) and become confused. That is why Feed Manager includes the ability to automatically and transparently transform the feeds it powers in HTML.

In order to style that HTML, a CSS stylesheet is applied to it. This makes the feed far more presentable than the raw HTML alone.

Below is a copy of this stylesheet which you are welcome to customize and use with your own projects.

See Also

Atom Feed XSL Stylesheet

.clr {
  clear: both;
  overflow: hidden;
  width: 1px;
  height: 1px;
  margin: 0 -1px -1px 0;
  border: 0;
  padding: 0;
  font-size: 0;
  line-height: 0;
}

body {
  padding: 0;
  margin: 0;
  font-family: "Trebuchet MS";
}

#container {
  margin: 0 auto 0 auto;
  padding: 10px;
  width: 800px;
}

#header {
  margin: 0 0 50px 0px;
}

#logo {
  float: left;
  padding: 0 30px 0 0;
}

#features ul {
  padding: 15px;
  margin: 0;
}

#features li {
  padding: 0 0 8px 0;
}

#header h1 {
  font-family: "Arial Black","Arial";
  font-weight: bold;
  font-size: 36px;
  margin: 0;
}
#header h2 {
  font-size: 14px;
  font-family: "Arial";
  margin: 0 0 0 30px;
}

#intro {
  width: 400px;
  text-align: left;
  margin: 0 0 0 270px;
}

#footer {
  font-size: 12px;
  margin: 20px auto 20px auto;
  border-top: 1px solid #CCCCCC;
}

#content {
  margin: 0;
  padding: 0;
  text-align: left;
  position: relative;
  float: left;
  width: 470px;
}

#sidebar {
  float: left;
  background: #EEEEEE;
  padding: 10px;
  width: 240px;
  font-size: 12px;
  margin: 0px 0 0 30px;
}

.main {
  width: 500px;
}

img {
  border: 0px;
}

#content h3,
#content h4 {
  margin: 0 0 5px 0;
}

#content h3 {
  font-size: 20px;
}

#content h4 {
  text-align: center;
  font-size: 16px;
  text-transform: uppercase;
  border-bottom: 1px solid #999999;
  padding: 0 0 5px 0;
}

#content h5 {
  font-size: 14px;
  margin: 8px 0 3px 0;
}

#content .img-wrapper {
  overflow: hidden;
  padding: 5px;
  border: 1px solid #CCCCCC;
}

#sidebar h4 {
  margin: 0;
  font-size: 14px;
  text-align: center;
  text-transform: uppercase;
  border-bottom: 1px solid #999999;
  padding: 0 0 5px 0;
}

#donate form {
  text-align: center;
}

#manual {
  display: none;
}

.entry-footer {
  font-size: 12px;
  margin: 0;
}

h3.entry-title {
  margin: 20px 0 0 0;
}

.entry-comments {
  font-size: 12px;
}

#powered-by {
  margin: 20px 0 0 0;
  text-align: center;
}
#powered-by img {
  margin: 10px;
}

#footer #mt,
#footer #fm {
  width: 50%;
  float: left;
}

Post a comment

(If you haven't left a comment here before, you may need to be approved by the site owner before your comment will appear. Until then, it won't appear on the entry. Thanks for waiting.)

Name:

Email Address:

URL:

Remember personal info?

Comments: (you may use HTML tags for style)

About Majordojo

"Majordojo" is the name under which Byrne Reese releases the software he writes. Byrne Reese is a father, a product engineer, an open source hacker and an employee of Six Apart.

Subscribe to this site's feed

Recent Comments

egoemmepi on Photo Gallery Documentation
Ram on Plugin Manager Prerequisites
Migrate Alone on Install Feed Manager
Byrne Reese on Install Media Manager
ali on Install Media Manager

Majordojo Projects

Movable Type Plugins

Other Projects