CSS
*#navli1 {font-family: “ues”;
src: url(/fonts/“uppereastside.eot”);
src: local(‘
’),
url(“uppereastside.woff”) format(“woff”),
url(“uppereastside.otf”) format(“opentype”),
url(“uppereastside.svg#grablau”) format(“svg”);
line-height: 100%;
color:#FFF;
font-size:220%; margin:0 0 5px;
list-style:none;
} This Fails ?
At times I wish want to use the @font-family with different floats, font colors, font sizes, etc.
How many different CSS definitions do I need to accomplish this?
I’m so frustrated I could S C R E A M !
What am I missing?
Here is my CSS page as of now . . .
@charset "utf-8";
/* CSS Document */
/* mapsearch.css 01/03/2012 5:55pm */
@font-face { font-family: "tang";
font-size:200%;
src: url(/fonts/"tangerine.eot");
src: local('☺'),
url("tangerine.woff") format("woff"),
url("tangerine.otf") format("opentype"),
url("tangerine.svg#grablau") format("svg");
font-weight: normal;
font-style: normal;
text-align:center;
color: #0CF;
float:right;
width:73.33%;
margin-bottom:12px;
margin-top:12px;
line-height:110%;
}
@font-face { font-family: 'ues';
src: url('uppereastside.eot');
src: local('☺'),
url('uppereastside.woff') format('woff'),
url('uppereastside.ttf') format('truetype'),
url('uppereastside.svg#webfont') format('svg');
font-weight: normal;
font-style: normal;
color: #0CF;
float:right;
width:73.33%;
margin-top:12px;
}
html, body { margin:0;
padding:0;
}
body { background: url(images/swirl.png) fixed; /*url(images/newbkground.png) fixed;*/
background-color: #0A1794;
font-family: Verdana, Geneva, sans-serif;
font-size:16px;
line-height:18px;
max-width: 1200px;
min-width: 400px;
padding-left:10px;
padding-right:10px;
margin-top:10px;
}
#maincontent{ float: right;
margin-left: 320px;
position: relative;
width: 880px;
background-image: url(images/gray4b32.jpg); /* background image for the iframe */
}
.header { float:right;
display:block;
position:relative;
margin-bottom:6px;
}
h1,h2,h3,h4,h5,h6
{ text-align:left;
color:#1ec2f9;
}
p { width:880px;
height:auto;
font-size:100%;
color: #fff;
}
.pright { text-align:center;
color: #39C;
float:right;
width:73.33%;
margin-bottom:4px;
}
.pleft { float:left;
font-size: 86%;
position: fixed;
margin-top:20px;
margin-left:1.2%;
padding:2px;
}
.psmaller { margin-top:5%;
margin-right:2%;
margin-left:2%;
font-size:62.50%;
line-height: 110%;
text-align: left;
color: #000;
}
.txtright { font-size: 87.50%;
display:block;
float:right;
width:880px;
position:relative;
margin-bottom:4px;
}
.plate { float:right;
display:block;
position: relative; /* IE bug fix*/
margin-bottom:10px;
}
/* ---------------container for the navigation ---------------------- */
#nav { margin:0; padding:0;
font-family: 'ues' ,sans-serif;
line-height: 100%;
color:#FFF;
font-size:100%; margin:0 0 5px;
float:left;
list-style: none;
font-style: none;
line-height: 110%;
position: fixed;
}
* html #nav{ position:absolute;}
#navli {font-size: 90%; margin:0 0 5px;
list-style: none;
}
*#navli1 {font-family: 'ues', sans-serif;
line-height: 100%;
color:#FFF;
font-size:220%; margin:0 0 5px;
list-style: none;
margin: 0 0 5px;
padding-left: 0;
}
#nav a,#nav a:link,#nav a:visited \\
{ color: #FFF;
list-style: none;
text-decoration: none;
background-color: ; color: #0CF; /* changes list text color;*/
}
#nav li a:hover{background-image:url(images/menubkrnd2.png);
width:260px;
color: #FFF; /* hover text color */
}
/*************************************************NAVIGATION ENDS HERE***************/
#footer { clear:both;
float:right;
font-size:62.50%;
font-style:normal;
line-height: 110%;
color: #000;
margin-top:1%;
padding-right:1%;
padding-left:1%;
}/* eND css*/
There is too much junk in my CSS page as a result of me trying to find S I M P L E reliable ways to code the approximately 6 or so elements on my pages.
It shouldn’t be so confusing.
Thanks Rick