Skip to main content
Inspiring
March 17, 2014
Answered

CSS not displaying properly

  • March 17, 2014
  • 2 replies
  • 612 views

My CSS file includes the following formatting for a "Note":

p.Note {

border-left-style: Solid;

border-right-style: Solid;

border-top-style: Solid;

border-bottom-style: Solid;

background-color: #fafade;

padding-left: 12px;

padding-right: 12px;

padding-top: 6px;

padding-bottom: 6px;

font-size: 9pt;

line-height: 12pt;

border-left-width: 1px;

border-right-width: 1px;

border-top-width: 1px;

border-bottom-width: 1px;

border-left-color: #a3a5a7;

border-right-color: #a3a5a7;

border-top-color: #a3a5a7;

border-bottom-color: #a3a5a7;

margin-top: 12px;

x-next-class: ;

x-next-type: P;

margin-bottom: 12px;

}

In IE 11, not using Document Mode=Edge, the CSS is applied as expected:

In IE 11, using Document Mode=Edge, the CSS is not applied as expected:

I suspect the issue is with the CSS itself.  The CSS displays correctly in the Design view of the topic in RH10, but does not display correctly if I view the topic using the CTRL+W command from within RoboHelp, and does not display correctly in the compiled project when viewed in Chrome or FireFox.  Any ideas?  Thanks!

This topic has been closed for replies.
Correct answer Tim D Morris

Resolved.  Class tag was somehow being applied as "note" instead of "Note".  Changed case and css now displays as expected.

2 replies

Willam van Weelden
Inspiring
March 19, 2014

If I have to guess, I would say it has to do with the name of the style.

Your HTML probably uses lower case while your selector in the CSS starts

with a capital letter.

Try the following selector:

p.note,

p.Note {

That should solve it.

Kind regards,

Willam

Tim D MorrisAuthorCorrect answer
Inspiring
March 17, 2014

Resolved.  Class tag was somehow being applied as "note" instead of "Note".  Changed case and css now displays as expected.