I’m using @font-face with fonts from Font Squirrel. (Kewl site)
They display very well in IE 8 but do not render in Chrome.
Uh . . . . is this because of bananas . . . or is there something else going on?
@font-face { font-family: 'gabrielle';
src: url('../css/fonts/gabrielle-webfont.eot');
src: local("☺"),
src: url('../css/fonts/gabrielle-webfont.eot?#iefix') format('embedded-opentype'),
url('../css/fonts/gabrielle-webfont.woff') format('woff'),
url('../css/fonts/gabrielle-webfont.ttf') format('truetype'),
url('../css/fonts/gabrielle-webfont.svg#gabrielleRegular') format('svg');
font-weight: normal;
font-style: normal;
}
Also, I’m designing a two column layout with CSS.
Most of the CSS Site Forum members know this already as I’ve driven them nuts for the past six month.
I wish to have a 320px left and a 880px right content window.
This is what I have . . .
html, body { margin:0; padding:0
}
body { background-color: #0A1794;
background: url(images/blkpyramids1.jpg) fixed; /*newbkground.png)*/
max-width: 1200px;
min-width: 400px;
font-family: Verdana, Geneva, sans-serif;
font-size:16px;
color:#fff;
line-height:106%;
margin-top:10px;
}
#maincontent{ float:right;
width:880px;
position:relative;
margin-left: 26.26%;
}
I did read Pauls Frequently Asked Questions in the CSS forum talking about this and almost understood all of it.
the example was . . .
#leftmenu {
width: 139px;
height: auto;
margin: 0px 10px 0px 0px;
border-right: 1px solid #C8C8C8;
background-color: #f2f2f2;
display: inline;
float: left;
position:relative;
left:-450px
}
Content {
width: 450px;
background: #fffccc;
text-align: left;
color: #000;
float:left;
position:relative;
left:150px;
}
I’d love to hear your comments on this.
Thanks . . . Rick
