Html Buffs

[Nova]

Hi guys. I recently refit the openXile site, using parts of wordpress themes found on the internet.

However, the fonts as you will probably see are mainly serif, and I want to turn them into san-serif. I'm not too fussed which font I use, something like Arial or Verdana. I'm not very good with fonts though, so any help would be much appreciated. This is the stylesheet:

@import url('box/reset.css');
@import url('box/menu-top.css');
@import url('box/wordpress.css');
@import url('box/sidebar.css');
@import url('box/post.css');
@import url('box/comment.css');
@import url('box/framework.css');
@import url('box/category.css');

body {
 text-align: center;
 font: 13px Georgia, "Times New Roman", Serif;
 color: #333;
 background: #fff url(images/bg.jpg) center 0 no-repeat;
}

a:link, a:visited {
 color: #000;
 text-decoration: none;
}

h1, h2, h3, h4, h5 {
 font-family: Cambria, Georgia, Times, "Times New Roman", serif;
}

/* Captions */
.aligncenter,
div.aligncenter {
 display: block;
 margin-left: auto;
 margin-right: auto;
}

.wp-caption {
 border: 1px solid #ddd;
 text-align: center;
 background-color: #f3f3f3;
 padding-top: 4px;
 margin: 10px;
 -moz-border-radius: 3px;
 -khtml-border-radius: 3px;
 -webkit-border-radius: 3px;
 border-radius: 3px;
}

.wp-caption img {
 margin: 0;
 padding: 0;
 border: 0 none;
}

.wp-caption p.wp-caption-text {
 font-size: 15px;
 line-height: 17px;
 padding: 0 4px 5px;
 margin: 0;
}
/* End captions */

img.alignright {
 display:inline;
 margin:0 0 2px 7px;
 padding:4px;
}

img.alignleft {
 display:inline;
 margin:0 7px 2px 0;
 padding:4px;
}

.alignright {
 float:right;
}

.alignleft {
 float:left;
}
.wp-caption {
 border:1px solid #ddd;
 text-align:center;
 background-color:#f3f3f3;
 padding-top:4px;
 margin:10px;
}

.wp-caption img {
 border:0 none;
 margin:0;
 padding:0;
}

.wp-caption p.wp-caption-text {
 font-size:11px;
 line-height:17px;
 margin:0;
 padding:0 4px 5px;
}

img.centered,.aligncenter,div.aligncenter {
 display:block;
 margin-left:auto;
 margin-right:auto;
}

img.wp-smiley { 
   vertical-align: -25%; 
}

.underads h5 {
 font-weight: normal;
 font-size: 11px;
}

.hide, h3.hide, h3.hiden {
 display: none !important;
 height: 0;
 width: 0;
 padding: 0;
 margin: 0;
}

h3.line {
 font-weight:400;
 font-size:13px;
 text-transform:uppercase;
 border-bottom:1px solid #888;
 margin-bottom:10px;
 padding-bottom:5px;
}

.flickr {
 text-align: left;
 padding-bottom: 15px;
}
.flickr ul {
 margin-left: 5px;
}
.flickr li {
 float: left;
 margin-right: 15px;
}
.flickr li img {
 border: 1px solid #ccc;
 padding: 4px;
 background: #fff;
 width: 50px;
}
.flickr li img:hover {
 border: 1px solid #999;
}
.ads728 {
 text-align: center;
 margin: 0 auto;
}

What would I need to do here?
Thanks in advance guys

 

[Alex.]

This is what I use most everywhere, replace all font/font-family lines with this:

font-family:Verdana,Tahoma,Arial,Helvetica,sans-serif;

 

[sam fisher]

Do you mean paste that new "font-family" line over "font" lines or just to modify them accordingly?

 

[Nova]

This is what I use most everywhere, replace all font/font-family lines with this:

font-family:Verdana,Tahoma,Arial,Helvetica,sans-serif;

Thanks Alex, sorted. I reckon it looks much better sans serif.

 

[gruso]

The new facelift is good, Nova. It seems to load faster too.

 

[sam fisher]

The new facelift is good, Nova. It seems to load faster too.

I noticed this aswell though I am unsure if it is for other reasons than the new theme.

 

[Nova]

The new facelift is good, Nova. It seems to load faster too.

I noticed this aswell though I am unsure if it is for other reasons than the new theme.

The last iteration was a lot more image based. But in addition to that, it had a lot of Wordpress plugins running in the background too. I can't say for certain that this caused a problem but since we turned them off, it seems a bit nippier.

Thanks Gruso.

 

[danielliu88888]

site looks a lot better :lol:

 

[Nova]

site looks a lot better :lol:

Shut it, Daniel.

 

[Klaus]

Just a quick note: If you want to do small modifications to your CSS, you could use Firebug for Firefox. You can change your CSS on the fly and Firebug displays the file and line-number where your change should go to make it permanent.

http://getfirebug.com/

 

[Nova]

Just a quick note: If you want to do small modifications to your CSS, you could use Firebug for Firefox. You can change your CSS on the fly and Firebug displays the file and line-number where your change should go to make it permanent.

http://getfirebug.com/

Oooh, that looks fairly awesome, I'll definitely give that a look.

On a sidenote, using some magical jiggery pokery and a touch of javascript, I managed to whip up a snowstorm on the site. So unnecessary, yet oh-so-festive.

 

[sam fisher]

I bet it took two clicks to get WordPress to install that plugin for you

 

[Nova]

I bet it took two clicks to get WordPress to install that plugin for you

Hey! I also had to enable it!

 

[sam fisher]

Oh, three clicks then?

 

[Nova]

Oh, three clicks then?

Well maybe a few more, cos I manually adjusted the maximum amount of snow on one page. But yeah, the gist is that it didn't take many clicks to add a nice 1999 effect to the site.