Stream overriding text properties set...

User 2800752 Photo


Registered User
4 posts

Hello,

I've gone through this forum and noticed that this is a common issue. However, I still couldn't figure out which part of the CSS overrides the properties. The specific webpage can be found at: http://www.asgmapping.com/news.html

The offending section is located in the bottom of the page. The paragraph font properties should be:
Font = Helvetica
Weight = Normal
Size = 14px
Line Height = 1.7

Any help is very much appreciated.

Thanks,
Regie
User 271657 Photo


Senior Advisor
3,816 posts

It doesn't seem to be the Stream since that's in Arial.
Have you tried changing the properties for this class in RSD:
<p class="paragraph">
...Or removing the "paragraph" and just using Helvetica for <p> in general?
I love deadlines. I like the whooshing sound they make as they fly by. (Douglas Adams)
https://www.callendales.com
User 2800752 Photo


Registered User
4 posts

The settings I set in RSD were the ones I listed (Font = Helvetica, Weight = Normal, Size = 14px, Line Height = 1.7). However, when the page is viewed in a browser the font properties that I set are not carried over. I assigned all paragraph elements into a class (paragraph-2). The ones in the other pages appear as expected. It is only in the page with the stream that it doesn't.

I've attached a screenshot of the font settings in RSD.
Attachments:
User 2800752 Photo


Registered User
4 posts

Could it be in the css in these links?

@import url('http://www.coffeecup.com/stylesheets/reset.css');
@import url('http://www.coffeecup.com/stylesheets/stream.common.css');

User 271657 Photo


Senior Advisor
3,816 posts

There's no font specified for this class :
p.paragraph.paragraph-2 {
padding-top: 0;
padding-right: 10px;
padding-left: 10px;
text-align: justify;
white-space: normal;
font-size: 14px;
}
"p.paragraph.paragraph-2" is different from ".paragraph-2"

You might try simplifying your CSS. For example, set your p default, then add a more specific style as needed –
p.highlight, p.small, p.special-offer.... for example. Much easier to keep up with what CSS is being applied to what items.
Don't forget your <h> tags, you might want to use <h4> or <h5> to emphasize/separate a block of text.
I love deadlines. I like the whooshing sound they make as they fly by. (Douglas Adams)
https://www.callendales.com
User 2800752 Photo


Registered User
4 posts

Thanks, paintbrush!

Your suggestions gave me some insight on how the software works. I assumed that because Font was assigned to Helvetica (under Typography) that it will be automatically written to the CSS. However, looking at the Inspector showed that this is not the case. I assigned this paragraph it's specific Class, and then changed the Font to something else and the property was written to the CSS. I then switched it back to Helvetica in the Design tab so that Helvetica was written on the CSS.

I would have thought though that the default properties should be all written on the CSS already.
User 271657 Photo


Senior Advisor
3,816 posts

Glad you've made some progress. :)

If you want to get to grips with CSS, you could read up on how the Cascade actually works.
Here's a quick overview (cascade, specificity, inheritance), with links to examples of each.
http://www.sitepoint.com/web-foundation … heritance/
I love deadlines. I like the whooshing sound they make as they fly by. (Douglas Adams)
https://www.callendales.com

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.