Help Formatting Blog Page Using CSS

Hi,

I have been working on formatting the page below using CSS:

http://www.thetechstore.co.uk/index.html

I'm working on integrating a blog into the site using blogger, feedburner and buzzboost

There are still some things that I can't work out how to do. Hopefully someone can help!?

1. I would like some white space between the end of an article and the start of the next article
2. I would like to make the dotted line under the title extend to the width of the page (not just an underline)
3. I would like this dotted line to also appear at the bottom of the article
4. I'd like to know how to change the styling on the Digg, Del.icio.us, links at the bottom of each article

CSS Code is attached below:

Thanks in advance!
<style type="text/css">
 
div.feedburnerFeedBlock ul { 
padding:50px;
margin-right:50px;
margin-left:50px;
list-style-type:none;
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size:medium;
color:#333333;
}
 
div.feedburnerFeedBlock ul li span.headline { 
font-weight:bold; 
letter-spacing:1px;
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size:x-large;
border-bottom:1px dashed #ccc
}
 
div.feedburnerFeedBlock ul li span a
{
color:#FF9900;
}
 
a:visited {
	text-decoration: none;
	color: #999999;
}
a:hover {
	text-decoration: none;
	color: #333333;
}
 
a:link {
	text-decoration: none;
	color: #ff9900;
}
 
#creditfooter
{
display: none;
}
 
</style>

Open in new window

LVL 21
shuboarderAsked:
Who is Participating?
 
joshnunnCommented:
If you are still interested in some help, could you post the code that you will be using for the site (not just the CSS)?

Some possibilities:
1. in "div.feedburnerFeedBlock ul li span.headline" add "padding-top: 10px;" (or more) to push the heading down automatically.
2.To extend the dotted line try adding "width:100%;" to the same section as the previous question.
3. Add "border-top:1px dashed #ccc" to the section.
4. I'd need to know the code you've got to help you style these buttons.

Some of these might not quite be right, but without some sort of example it's hard to figure out which solution might be best.
0
 
scrathcyboyCommented:
1.  use <BR /> <BR /> for as much whitespace as you need
You can also do this on the container the text is in, using CSS with -- margin-bottom:40px; or similar
2. use HR and style in CSS -- HR {width:640px; color:silver; }  or similar.  That looks good
3.  HR {width:640px; color:silver; style:dotted;}
0
 
shuboarderAuthor Commented:
I managed to solve this myself in the end, but points rewarded for the effort.

Thanks.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.