blog archive spacing between the years
Having a problem where the spacing of the years in my archive aren't all the same.
The first two are fine, but then as you look down, it increases, then the last two are fine again. How can I fix this? Here's some code :
- <style type="text/css">
- ul {
- /* These are lists which will have bullet points unless we remove them like this */
- list-style-type: none;
- }
- li {
- /* These are the individual list items--the years, the months, the links. We want them to have some space between them to look nicer, and we can do that using margin. */
- margin-top: 10px;
- margin-bottom: 10px;
- }
- button {
- /* Buttons have borders and backgrounds by default, let's remove those */
- border:none;
- background:none;
- cursor:pointer;
- color:#741dff;
- font-family:Overpass, Georgia, Arial, Verdana;
- font-size:18px;
- position:relative;
- top:0px;
- left:0px;
- z-index:9999;
- outline:none;
- }
- button::-moz-focus-inner {
- border: 0;
- }
- button:hover {
- border:none;
- background:none;
- cursor:pointer;
- color:white;
- font-family:Overpass, Georgia, Arial, Verdana;
- font-size:18px;
- position:relative;
- top:0px;
- left:0px;
- z-index:9999;
- text-shadow:0px 0px 1px black, 0px 0px 1px black, 0px 0px 1px black, 0px 0px 1px black, 6px 0px 12px #6871b8, -6px 0px 12px #6871b8;
- }
- button.special::before {
- /* :before is a "pseudoelement" which lets us put something on the page (before or after an element, in this case, all buttons) using only CSS */
- content: "►";
- /* This has to be inline-block for the transform below to work */
- display: inline-block;
- color:#000;
- font-family:Overpass, Georgia, Arial, Verdana;
- font-size:18px;
- position:relative;
- top:0px;
- left:0px;
- cursor:pointer;
- z-index:9999;
- text-shadow:none;
- outline:none;
- }
- button.special2::before {
- /* :before is a "pseudoelement" which lets us put something on the page (before or after an element, in this case, all buttons) using only CSS */
- content: "►";
- /* This has to be inline-block for the transform below to work */
- display: inline-block;
- color:#741dff;
- font-family:Overpass, Georgia, Arial, Verdana;
- font-size:18px;
- position:relative;
- top:0px;
- left:0px;
- cursor:pointer;
- z-index:9999;
- text-shadow:none;
- outline:none;
- }
- #monthly {
- display: inline-block;
- color:black;
- font-family:Overpass, Georgia, Arial, Verdana;
- font-size:18px;
- position:relative;
- top:0px;
- left:0px;
- cursor:pointer;
- z-index:9999;
- text-shadow:none;
- }
- button.flip::before {
- transform: rotate(90deg);
- }
- /* To begin with, we'll hide what's in the year and month listings. The slideDown over in the jQuery will make them appear later. */
- .year-inner {
- display: none;
- }
- .month-inner {
- display: none;
- }
- .archiveheader {
- text-decoration:none;
- color:black;
- font-family:Laila, Arial, Verdana;
- position:absolute;
- top:800px;
- left:1142px;
- font-size:21px;
- z-index:9999;
- }
- .blogarchivewrapper {
- position:absolute;
- top:820px;
- left:1100px;
- width:300px;
- height:600px;
- }
- .bloglinks {
- font-family:Overpass, Georgia, Arial, Verdana;
- font-size:18px;
- color:black;
- }
- </style>
"I can only show you the door. You're the one that has to walk
through it." ~ Morpheus The Matrix