Solved

Help Formatting Blog Page Using CSS

Posted on 2008-10-23
3
351 Views
Last Modified: 2012-05-05
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

0
Comment
Question by:shuboarder
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
3 Comments
 
LVL 44

Assisted Solution

by:scrathcyboy
scrathcyboy earned 200 total points
ID: 22792149
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
 
LVL 2

Accepted Solution

by:
joshnunn earned 300 total points
ID: 23630098
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
 
LVL 21

Author Closing Comment

by:shuboarder
ID: 31509389
I managed to solve this myself in the end, but points rewarded for the effort.

Thanks.
0

Featured Post

Online Training Solution

Drastically shorten your training time with WalkMe's advanced online training solution that Guides your trainees to action. Forget about retraining and skyrocket knowledge retention rates.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
How can I make my tabs look like this? 1 51
Flex Messes  With Horizontal Positioning 2 35
boostsrap 1 35
CSS (jquiry mobile) question 3 34
If you don't have the right permissions set for your WordPress location in IIS, you won't be able to perform automatic updates. Here's how to fix the problem.
In order to have all security and back ups taken care of, WordPress users can sign up for services with WP Engine.
The purpose of this video is to demonstrate how to prevent comment spam on a WordPress Website. This will be demonstrated using a Windows 8 PC. Plugin Akismet will be used. Go to your WordPress login page. This will look like the following: myw…
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.

710 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question