tumblr rss feed html template


<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>rss template</title>
    <link href="/yourstyle.css" rel="stylesheet" type="text/css" media="all">
    <style>


body {
  font-family: calibri;
}


/* ====== external container ======*/
#container {
  margin: auto;
  margin-top: 1%;
  width: 500px;
  margin: auto;
  padding-top: 2%;
}


/* ====== main rss container ======*/
.rss-box { margin-top: 5%; }


/* ====== rss entry scrollbar ======*/
.rss-item::-webkit-scrollbar { width: 10px; }
.rss-item::-webkit-scrollbar-track { background: #555; }
.rss-item::-webkit-scrollbar-thumb { background-color: #000; }


/* ====== removes entry ul padding ======*/
ul { padding: 0%; }


/* ====== individual rss entry style ======*/
li.rss-item {
  list-style-type: none; /*removes bullet point*/
  margin-bottom: 5%; /*adds space between entries*/
  padding: 1% 3% 3% 3%; /*entry padding*/
  overflow-y: auto; /*adds a scroll if entry height is over the max height*/
  max-height: 400px; /*sets entry max height*/
  border: 1px solid black;
}


/* ====== rss entry links ======*/
li.rss-item a { font-weight:bold; text-decoration:none;}
li.rss-item a:hover { color: gray; }


/* ====== rss entry date ======*/
.rss-date {
  display:inline-block;
  padding-bottom: 1%;
  padding-top: 4%;
  border-bottom: 1px solid black;
}


/* ====== removes rss entry title; set display: visible; to show it ======*/
a.rss-item:first-child { display:none; }


/* ====== fixes image size and alignment ======*/
.rss-item img { text-align: center; width: 100%; }


    </style>
    </head>
    <body>


<div id="container">
< insert your rss script here> <br>
<a href="https://www.feedroll.com/rssviewer/">here is a free rss feed viewer you can use.</a>
</div>


    </body>
    </html>