Can you tell me why the font is displaying differently in these two browsers?
http://lsnewsletters.com/screenshots/Propulsion2.jpg
Firefox is displaying it the way intended
Font Styling Inconsistencies in IE / Firefox
13 posts from 4 voices- Started 8 months ago by jeanstorms
- Latest reply from Nick
- This topic is resolved
-
Posted 8 months ago #
-
The fonts are either in the theme's original CSS or in the Custom CSS area in the propulsion theme's styling tools in the wp-admin. I am not using a plugin - just the theme tools you provide.
Posted 8 months ago # -
You can try to change the default font family to "Arial". Add following code to css/custom.css:
body { font: 13px/1.65em Arial, "HelveticaNeue", "Helvetica Neue", Helvetica, sans-serif; } .flex_column h1, .flex_column h2, .flex_column h3, .flex_column h4, .flex_column h5, .flex_column h6{ font: 13px/1.3em Arial, "HelveticaNeue", "Helvetica Neue", Helvetica, sans-serif; }Posted 8 months ago # -
Can you review my Quick CSS code to see if I have something out of order or if there is a better way to add it? I did some testing with Adobe Browser Labs and the problem did not show up there. However, if I'm seeing it, then it is likely someone else will too.
I prefer to have Helvetica be the first option, then Arial as an alternative. I think that's what I've set up here. But I know with CSS there can be some rules to the order things need to be listed. Maybe I have something out of order (?) because the font is showing up bold and all caps too...
Here is the current code - is there a better way to write it?
.page-id-100 .title_container.extralight-border {
display: none !important;
}#top
.slideshow {
border-bottom: 1px solid #cccccc;
}#header {
background: url("http://landlordsource.com/wp-content/uploads/2012/09/HeaderBackground.jpg");
background-repeat:no-repeat;
}#header
.main_menu
{
padding-bottom: 20px;
position: relative;
top: 10px;
z-index:100;
}#top
.tab {
color: #152556;
font-size: 11px;
text-decoration:underline;
}#top
.active_tab {
border-bottom: medium none;
position: relative;
z-index: 4;
color: #6E0D44;
text-decoration:none;
}.wp-caption-text {
display: block;
font: bold 10px,"Hevetica Neue" Helvetica, Arial, sans serif;
margin: 0 auto;
padding: 0px 0px 0px;
text-align: center;
text-transform: uppercase;
color: #333333;
}#top .meta-color, div .meta-color a, .main_menu ul li a, #top .comment-container a, #top .widget ul li a, .minitext, .form-allowed-tags, div .pagination, #comments span, .minitext, .commentmetadata a, .blog-tags, .blog-tags a, .title_container #s, .wp-caption, blockquote:before, blockquote:after, blockquote small, blockquote cite, .hero-text, .js_active .tab, .news-time, .contentSlideControlls a, #js_sort_items a, .text-sep, .template-search a.post-entry .news-excerpt, ul.borderlist > li, .post_nav, .post_nav a, .quote-content, #top .widget_nav_menu li, .tweet-time, #top .avia_parnter_empty, .avia_socialcount a span, td, #top th.nobg, caption, .page-title {
color: #333333;
}.page-title
{
font: 18px/1.2 em, "Trebuchet MS",Terminal Dosis;
}.widgettitle
{
font: bold 10px, "Helvetica Neue", Helvetica, Arial, Sans serif;
}h1.post-title.offset-by-three {
font-size: 18px;
}h1, h2, h3, h4, h5, h6, .hero-text, blockquote, legend, #top .slideshow_caption h1 {
font-family: Trebuchet MS,Terminal Dosis;
}.js_active .tab {
font: 11px/1.3 em, Helvetica, Arial, Sans serif;
text-transform: uppercase;
}.flex_column h1,.flex_column h2,.flex_column h3 .flex_column h4, .flex_column h5, .flex_column h6
{
font: bold 11px/1.3 em, "Helvetica Neue", Helvetica, Arial, Sans serif;
margin-bottom: 6px;
text-transform: uppercase;
}Posted 7 months ago # -
Devin
ModeratorCan you link to the page that is showing the issue? It will be much easier to inspect it in browser and compare with IE live. I'm guessing the default theme style is still loading in with priority by your description so it could be a pretty simple fix in that case.
Regards,
Devin
Posted 7 months ago # -
The URL for the page is http://landlordsource.com/home
thanks for looking!
Posted 7 months ago # -
Nick
ModeratorHi,
I looked in explorer 9 and I see nothing like what your browser displayed. http://i.imgur.com/dJv35.jpg Chances are your browser needs to be rein stalled or you've made customizations within your IE9 display that overrides the css.
The only thing I would suggest is to add this to your CSS to get rid off the cross bars in titles
.beta-font-b .title, .beta-font-b .title p { line-height: 28px; }Thanks,
Nick
Posted 7 months ago # -
Thank you for the confirmation. I appreciate it.
What exactly does the code you recommended change? I added it to my site CSS, but did not see any effects. Can you screenshot the area for me?
Thanks!
Posted 7 months ago # -
Thank you - that makes sense. That leads to one more question - if someone knows the answer. I would really like these forms to open in a light box, and stay in a lightbox for the thank you page. Is there a way to do that?
Posted 7 months ago # -
Devin
ModeratorHey jeanstorms,
I'm sure it is possible but not with anything we could guide you through. I believe the lightbox plugin used in the theme (prettyPhoto) supports iframes but it would be a matter of modifying the plugin used to run through prettyPhoto instead of whatever it is using now.
A freelance web developer should be able to assist in getting that taken care of for you but I'm unsure of the time needed since it may or may not be overly complicated.
Regards,
Devin
Posted 7 months ago #
Reply
You must log in to post.
Create a new thread and tell me what problems you are encountering and what you want to know. 
There is no step 3 :) 
