I am struggling to comprehend why this is not functioning the way I had envisioned. While I can come up with workarounds, my main question remains unanswered.
.content {
display: flex;
height: 700px;
background: linear-gradient(95deg, rgba(255, 255, 255, 1) 50%, rgba(26, 26, 26, 1) 50%);
/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.center {
width: 100px;
height: 100%;
}
.left {
padding: 60px 60px 60px 130px;
}
.right {
padding: 60px 130px 60px 60px;
color: white;
}<div class="content">
<div class="left">
<h1>Sports Car</h1>
<h2> What is a sports car? A car may be a sporting automobile without being a sports car.</h2>
<p>A sports car, or sportscar, is a small, usually two-seater, two-door automobile designed for spirited performance and nimble handling. The term "sports car" was used in The Times, London in 1919. According to USA's Merriam-Webster dictionary, USA's
first known use of the term was in 1928. Sports cars started to become popular during the 1920s.
<br> Sports cars may be spartan or luxurious, but high maneuverability and light weight are requisite. Sports cars are usually aerodynamically shaped (since the 1950s), and have a low center of gravity compared to standard models. Steering and suspension
are typically designed for precise control at high speeds.Traditionally sports cars were open roadsters, but closed coupés also started to become popular during the 1930s, and the distinction between a sports car and a grand tourer is not absolute.
</p>
</div>
<div class="center"> </div>
<div class="right">
<h1>Seating Layout</h1>
<h2> Traditional sports cars were typically two-seat roadsters.</h2>
<p>Although the first sports cars were derived from fast tourers, and early sporting regulations often demanded four seats (even three-seaters were often produced by coachbuilders), two seats became common from about the mid-1920s. Modern sports cars
may also have small back seats that are often really only suitable for luggage or small children; such a configuration is referred to as a 2+2 (two full seats + two "occasional" seats).
<br> Over the years, some manufacturers of sports cars have sought to increase the practicality of their vehicles by increasing the seating room. One method is to place the driver's seat in the center of the car, which allows two full-sized passenger
seats on each side and slightly behind the driver. The arrangement was originally considered for the Lamborghini Miura, but abandoned as impractical because of the difficulty for the driver to enter/exit the vehicle. McLaren used the design in their
F1.
</p>
</div>
</div>Upon viewing it on my screen, I noticed that my inspector reports the middle box to only be around 15px, despite defining it as 100px in my CSS. What could be the reason behind this discrepancy? Furthermore, how can I give priority to ensuring that a specific box (in this case, the middle one) maintains its desired size over others that are compressing it?