Friday, June 11, 2010

Blog design

Blogger is great for the flexibility it gives users in customizing themes and layout. After you set the default colors and fonts of your blog, you may still find that there are other properties you'd like to customize. In the interests of allowing other would-be bloggers to learn from our work, I will document the CSS properties I added to the template using the HTML editor function on Blogger.

Here are the styles I added to the template in order to set the background image and anchor it to the top:

body {
background-image:url('http://farm2.static.flickr.com/1303/4689693936_a31a9da55d_o.jpg');
background-repeat:x-repeat;
background-attachment:fixed;
}

#outer-wrapper {
background:$bgcolor;
}

These CSS styles I added to the Flickr badge:

#flickr_badge_uber_wrapper {
text-align:center;
width:175px;
}

#flickr_badge_wrapper {
padding:10px 0 10px 0;
}

.flickr_badge_image {
margin:0 5px 0 5px;
}

.flickr_badge_image img {
border: 1px solid black !important;
margin: 5px 4px 0px 0;
display:inline;
float:left;
}

#flickr_badge_source {
text-align:left;
margin:5px 10px 0 10px;
}

#flickr_badge_icon {
float:left;
margin:5px 5px 0 0;
}

No comments:

Post a Comment