CSS in a Help Text for a page item gets applied to other page items in Oracle APEX

Question

I have defined the following Help Text for a drop down list on a page in oracle APEX :

<html>
<style>
table, th, td {
  border:1px solid black;
}
</style>
<body>
<table style="width:100%">
 <tr>
    <th>Category</th>
    <th>Description</th>
  </tr>
   
   <tr>
    <td>Category1</td>
    <td>Description1</td>
    
  </tr>
  
   <tr>
    <td>Category2</td>
    <td>Description2</td>
    
  </tr>
  
   <tr>
    <td>Category3</td>
    <td>Description3</td>
    
  </tr>
    
</table>
</body>
</html>

When I click the question mark to see the help text, the style gets applied to other page items on the page, and I have to refresh the page to reset the style. How can I fix this problem?

Well table, th, td applies the style to all elements of those types, so what else did you expect, and why? If you want a style to apply to a specific element or elements, then give them a class and make the style apply only to that class — ADyson
– ADyson, Commented 2 days ago
P.S. If this is HTML that's designed to be included into another page as an extra item, why did you wrap it in <html> and <body> tags? This makes no sense. You cannot have more than one set of such tags in a single HTML document. The browser may have been forgiving and ignored this mistake but technically it's completely invalid. — ADyson
– ADyson, Commented 2 days ago

MT0 · Accepted Answer · 2025-11-19 17:02:12Z

Give the element an id and only apply the styles to that id:

<style>
table#your_id_value,
table#your_id_value th,
table#your_id_value td
{
  border:1px solid black;
}
</style>
<table style="width:100%" id="your_id_value">
 <tr><th>Category</th><th>Description</th></tr>
 <tr><td>Category1</td><td>Description1</td></tr>
 <tr><td>Category2</td><td>Description2</td></tr>
 <tr><td>Category3</td><td>Description3</td></tr>
</table>

Or give the element a class:

<style>
table.black-border,
table.black-border th,
table.black-border td
{
  border:1px solid black;
}
</style>
<table style="width:100%" class="black-border">
 <tr><th>Category</th><th>Description</th></tr>
 <tr><td>Category1</td><td>Description1</td></tr>
 <tr><td>Category2</td><td>Description2</td></tr>
 <tr><td>Category3</td><td>Description3</td></tr>
</table>

Then elements without that id or class will not have the style applied to them.

Collectives™ on Stack Overflow

CSS in a Help Text for a page item gets applied to other page items in Oracle APEX

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related