Go Premium for a chance to win a PS4. Enter to Win

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 306
  • Last Modified:

CSS problem

I have this very simple site:

http://tinyurl.com/797vsae

The H1 and P text is supposed to use a font called museo slab but the font is not rendering. Can't figure out why. Any idea?

h1 {
      font:500 40px "museo-slab-1", "museo-slab-2", "Helvetica Neue", Helvetica, Arial, sans-serif;
      color:#49413c;
      margin-bottom:20px
      }
0
lvollmer
Asked:
lvollmer
  • 3
  • 3
1 Solution
 
Tom BeckCommented:
@font-face {  
  font-family: yourFontName ;  
  src: url( /location/of/font/FontFileName.ttf ) format("truetype");  
}  
 
/* Then use it like you would any other font */  
.yourFontName { font-family: yourFontName , verdana, helvetica, sans-serif;  
}  

From here: http://randsco.com/index.php/2009/07/04/p680
0
 
lvollmerAuthor Commented:
that doesn't seem to be working, here is the amended CSS:

/* CSS Document */
@font-face {
	font-family: Museo500;
	src: url(http://s130859622.onlinehome.us/hp/sitedown/MuseoSans-500.otf) format("opentype");  
}
@font-face {
	font-family: Museo700;
	src: url(http://s130859622.onlinehome.us/hp/sitedown/MuseoSans-700.otf) format("opentype");  
}
body {
	background:#f1f1e7 !important;;
}
#wrapper {
	width: 940px;
	padding-top: 0pt;
	padding-right: 10px;
	padding-bottom: 0pt;
	padding-left: 10px;
	margin-top: 0pt;
	margin-right: auto;
	margin-bottom: 0pt;
	margin-left: auto;
	box-shadow: 0pt 0pt 20px rgba(0, 0, 0, 0.05); 
}

h1 {
	font-family: Museo500, sans-serif; 
	font-size:40px;
	font-weight:500;
	color:#49413c;
	margin-bottom:20px
	}
	
.body {
	width:570px;
	margin:auto;
}
.body p {
	font-family: Museo300, sans-serif; 
	font-size:24px;
	font-weight:300;
	color:#49413c;
	margin-bottom:20px
	}
#tabs ul {
	margin-left: 0;
	padding-left: 0;
	display: inline;
	} 

.social {
	margin:0 auto;
	padding-top:20px;
	padding-bottom:100px;
}

#wrapper ul li {
	padding: 2px 15px 5px;
	list-style-type: none;
	display: inline;
	}
	
.footer {
	clear: both;
	color: #f1f1e7;
	background-color: #524c39;
	height:100%;
}

Open in new window

0
 
Tom BeckCommented:
In my test with the Museo500 font, the downloaded font renders correctly in Chrome and IE. Do I need to check a specific browser or version?
Museo500
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
Tom BeckCommented:
I now see that the Museo500 font looks quite different than my test when viewed on this site.

http://www.myfonts.com/fonts/exljbris/museo/500/
0
 
lvollmerAuthor Commented:
yes - I usd the wrong museo font, it is supposed to be museoSLAB not museosans, I am changing it now and will report back
0
 
lvollmerAuthor Commented:
Thanks - I got it working on another server.
0

Featured Post

Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

  • 3
  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now