CODEWITHSUNDEEP
docusignapi
peachers
peachers

Reputation: 31

background-color not showing up on <div> in DocuSign but shows up when exporting to PDF

I have a div inside my HTML document for responsive signing:

<div class="header" style="line-height: 30px; font-size: 1em; background-color: #f9f9f9; padding: 37px 60px;"></div>

The color does NOT show up inside DocuSign's view, but when I export the document as a PDF, it shows up there just fine.

I have also tried background, with no success either.

This link says that background-color is supported. https://developers.docusign.com/docs/esign-rest-api/esign101/concepts/responsive/setting-tabs/

EDIT: Sorry, I might have been as clear as I should have. Here is a better example of the code I am trying to run:

<!DOCTYPE html>
<html>
    <head>
      <meta charset="UTF-8">
    </head>
    <body style="font-family: sans-serif; padding: 0px; margin: 0px; font-size: 12px; padding: 0px; color: #11263c;">
        <div class="header" style="line-height: 30px; font-size: 1em; background-color: #f9f9f9; padding: 37px 60px;"> 
            Some other divs with content are here...images, text, etc.
        </div>
        <div class='some-other-content-div'>Blah</div>
        <div class='some-other-content-div-2'>Blah</div>
    </body>
</html>

The div with the class header is the one that is not showing the color behind it and its children. The value of "pink" worked and its HEX value, the color WHiteSmoke and its HEX (#F5F5F5) worked as well...but not the color GhostWhite or its HEX value (#F8F8FF) or the color I actually want to use...#F9F9F9. Just examples of colors I have tried...I hope this clarifies a bit more!

Upvotes: 1

Views: 254

Answers (1)

Inbar Gazit
Inbar Gazit

Reputation: 14015

This may be a bug, which I'll ask to be fixed. From what I can tell, it's dropping empty divs until it finally gets to some content. Including any visible elements before their div, or an invisible div with content "<div style='display:none'>.</div>", seems to get it working correctly. So this is the workaround for now.

Upvotes: 1

Related Questions