I am struggling with 1 div in your CSS inline implement these 3 options:
#1
<div style="padding: 10px; background-color: rgb(072,000,017); border-radius: 10px;">
#two
<div style="position: relative; padding: 10px; background-color: rgb(072,000,017); border-radius: 10px;">
#3
<div style="position: absolute; padding: 10px; background-color: rgb(072,000,017); border-radius: 10px;">
the problem is that this div does not cover 100% of the width that if it covers its child elements and there is a horizontal scroll, I am using a label code
that contains labels span
and that in turn contain spaces html
(
) that I should not touch, as I do for this div to cover those spaces?:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
.container {
height: 97vh;
}
.helper {
float: left;
width: 50%;
height: 100%;
min-height: 100%;
white-space: nowrap;
overflow: scroll;
}
</style>
</head>
<body>
<div class="container">
<div class="helper">
<div style="padding: 10px; background-color: rgb(072,000,017); border-radius: 10px;">
<!--NO Tocar esto es automatico-->
<code><span style="color: rgb(102,217,239); background-color: rgb(072,000,017); white-space: nowrap;">
<span style="color: rgb(189,063,075); background-color: rgb(072,000,017); white-space: nowrap;"></span><span style="color: rgb(254,172,002); background-color: rgb(072,000,017); font-style: italic; white-space: nowrap;">// Theme: (Red)| Given Variable | Type: object <br></span><span style="color: rgb(189,063,075); background-color: rgb(072,000,017); white-space: nowrap;">$given_var </span><span style="color: rgb(254,254,254); font-weight: bold; background-color: rgb(072,000,017); white-space: nowrap;">=(object)[ </span><span style="color: rgb(254,172,002); background-color: rgb(072,000,017); font-style: italic; white-space: nowrap;">// object node of Class: MyHelloWorld, implement of traits: talkWorld. <br> </span><span style="color: rgb(189,008,025); background-color: rgb(072,000,017); white-space: nowrap;">'__construct' </span><span style="color: rgb(254,254,254); font-weight: bold; background-color: rgb(072,000,017); white-space: nowrap;">=> </span><span style="color: rgb(189,008,025); background-color: rgb(072,000,017); white-space: nowrap;">"no parameters"</span><span style="color: rgb(254,254,254); font-weight: bold; background-color: rgb(072,000,017); white-space: nowrap;">, </span><span style="color: rgb(254,172,002); background-color: rgb(072,000,017); font-style: italic; white-space: nowrap;">// Method of class: MyHelloWorld, modifiers: (public), return type: undefined. <br> </span><span style="color: rgb(189,008,025); background-color: rgb(072,000,017); white-space: nowrap;">'sayHello' </span><span style="color: rgb(254,254,254); font-weight: bold; background-color: rgb(072,000,017); white-space: nowrap;">=> </span><span style="color: rgb(189,008,025); background-color: rgb(072,000,017); white-space: nowrap;">"no parameters"</span><span style="color: rgb(254,254,254); font-weight: bold; background-color: rgb(072,000,017); white-space: nowrap;">, </span><span style="color: rgb(254,172,002); background-color: rgb(072,000,017); font-style: italic; white-space: nowrap;">// Method of class: MyHelloWorld, modifiers: (public), return type: undefined. <br></span><span style="color: rgb(254,254,254); font-weight: bold; background-color: rgb(072,000,017); white-space: nowrap;">]; <br></span><span style="color: rgb(254,172,002); background-color: rgb(072,000,017); font-style: italic; white-space: nowrap;">// [BOH] Basic Output Handler for PHP - Copyright 2020 - 2021 <br>// Open Source Project Developed by Icaros Net. S.A </span>
</span>
</code>
<!--NO Tocar esto es automatico-->
</div>
</div>
<div class="helper">
Otro Sitio.
</div>
</div>
</body>
</html>
Current result and expected result that covers the missing spaces:
Maybe you can use flex so that the div helper covers all the code, something like this:
Despite having chosen another answer as a solution, I also leave you this one: just in case you don't want to touch any other element or CSS you have to mix
position: relative
and in this casefloat: left
: