wordpress - CSS selector to use for sIFR menu -
i've used sifr simple applications headings, i'm trying use 2 different fonts simultaneously - 1 heading , 1 menu.
heading works, not menu. i'm using tofurious wordpress theme. section of theme's stylesheet governs menu font , link styles:
/*menu colors****************/ #menu { background:#bc7d90; } #menu li { font:11px arial, helvetica, sans-serif; /*menu font styles*/ text-transform: uppercase; color:#fff; /*menu font color*/ } #menu li a:hover { color:#ecd1d9; /*menu font color when hovering*/ }
i entered #menu li item replace on sifr settings page, , used code:
.sifr-root { font-size:15px; font-weight:normal; color:#fff; } { text-decoration:none; color:#fff; } a:hover { color:#fff; }
the font appears - not of styles specified above, , appears on blog in unexpected way. can see example @ address: www.laurenparkinson.com/blog
also, actual sub-menu items not appearing @ all.
you'll big favor ditching sifr @font-face supported in major browsers including ie since version 4 (more compatibility information: http://webfonts.info/wiki/index.php?title=@font-face_browser_support).
@font-face { font-family: myfont1; src: url('myfont1.eot'); /*for ie*/ src: local('myfont1'), url('myfont1.ttf') format('truetype'); } @font-face { font-family: myfont2; src: url('myfont2.eot'); /*for ie*/ src: local('myfont2'), url('myfont2.ttf') format('truetype'); } #header{ font-family: myfont1, georgia, times new roman, serif; } #menu { font-family: myfont2, verdana, arial, sans-serif; }
just make sure fonts licensed embedding.
online eot converter: http://www.kirsle.net/wizards/ttf2eot.cgi
Comments
Post a Comment