Search code examples
cssoracle-jet

how can I have a item with background 100% width of the oj-panel

Currently have a oj-panel with another oj-panel inside but I want that, the second one to have the background color covered till the border of the first one... current state of project

Current code:

<div class="oj-panel" style="border-style: solid; border-color: lightgrey;">
<div class="oj-panel" style="background-color: lightgrey">
    <span data-bind="text: oj.Translations.getTranslatedString('application.name')"/>
</div>

example of what I want to implement

Is the oj-panel the best way to go? If so, how can I have the background covered til the borders?

Solution

  • Remove the padding from the parent div, margins on your child div and use width: 100% on your child div.

    Try:

    .oj-panel {
  padding: 0;
  margin: 0;
  width: 100%;
}