Skip to main content
Inspiring
January 24, 2014
Question

CSS3 in standard WebHelp

  • January 24, 2014
  • 1 reply
  • 929 views

RH10 | WebHelp

Does anyone know if it's possible to render CSS3 in the standard WebHelp output, not the Multiscreen output? For example, I use the following CSS to create a button with round corners, but when viewed in IE the round corners don't display. However, in Firefox they display fine.

.btn-primary-action {

background-color: #eeaf00;

  -webkit-border-top-left-radius: 6px;

  -moz-border-radius-topleft: 6px;

border-top-left-radius: 6px;

  -webkit-border-top-right-radius: 6px;

  -moz-border-radius-topright: 6px;

border-top-right-radius: 6px;

  -webkit-border-bottom-right-radius: 6px;

  -moz-border-radius-bottomright: 6px;

border-bottom-right-radius: 6px;

  -webkit-border-bottom-left-radius: 6px;

  -moz-border-radius-bottomleft: 6px;

border-bottom-left-radius: 6px;

text-indent: 0px;

display: inline-block;

color: #ffffff;

font-size: 16px;

height: 47px;

line-height: 47px;

width: 193px;

text-align: center;

text-decoration: none;

margin:20px 6px 0 0;

}

Thanks

Jonathan

This topic has been closed for replies.

1 reply

Jeff_Coatsworth
Community Expert
Community Expert
January 24, 2014

If it’s working in FF and not in IE, then it sounds like whatever you’re doing isn’t supported by IE – are you expecting RH to do something about that?

Jop_SmithAuthor
Inspiring
January 24, 2014

I've used the same CSS outside RH, attached to a HTML page, and it works in IE. It's only when the CSS is used in RH that it stops working. It looks like RH is preventing it from working somehow.

Willam van Weelden
Inspiring
January 30, 2014

The CSS isn't in the topc itself, it's in the main CSS file. I've tried it both ways and I've copied the CSS into my output manually after I've generated it, but it's still the same. Weirdly, the buttons look fine when I preview them in RH and when I use the "View with..." button to preview in the browser itself.

Strange


On which browser? IE? In that case, the browser rendering mode can

ignore certain CSS styles if they don't fit the browser's mode. (Such as

CSS3 for IE8 mode.)

Kind regards,

Willam