0

So I have two divs inside the "Content" div (Shown as the white box in the image below.) and they both have text in them, I want the "Content" div to have the same height and width as the two divs below joined, but the "Content" div's width is the only thing that is "normal".

I even tried to set the height manually but that's not what I want, I wanted to have the height automatically be the same as the content's.

Why are you like this "Content" div?

The website being inspected:

enter image description here

The HTML code and CSS rules required to recreate the bug (Except that in here, the div is now grey):

#Content {
  background-color: grey;
  padding: 10px;
  position: relative;
  top: 136px;
}

#Main {
  border-right: solid 2px;
  padding-right: 2%;
  width: 55%;
  float: left;
}

#Sidebar {
  width: 35%;
  float: right;
}
<div id="Content">
  <div id="Main">
    <h1>Lorem ipsum</h1>

    <p>lorem ipsum dolor sit amet</p>
  </div>

  <div id="Sidebar">
    <h2>Lorem ipsum</h2>
  </div>
</div>
Falling10fruit
  • 197
  • 1
  • 12
  • 1
    Welcome Falling10fruit to SO, sorry my PC got hanged while extracting code from your images. Plz provide code (`html` `CSS`) in text format – Rana Nov 28 '21 at 06:16
  • 1
    Please do not provide code just in image form but put a working snippet actually within your question which demonstrates the problem. Please see https://stackoverflow.com/help/minimal-reproducible-example – A Haworth Nov 28 '21 at 06:27
  • In addition to code being better than an image, I don't think I could answer this question without seeing more of your CSS code. What CSS is being applied to those 3 elements? – xdhmoore Nov 29 '21 at 01:22

1 Answers1

-1

The content of the content.div div has some CSS style set so that the height of the content.div cannot be stretched out by its own content

松松从不撩妹
  • 1
  • As it’s currently written, your answer is unclear. Please [edit] to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Nov 28 '21 at 08:22
  • Hmm, okay, so which one of these CSS rules might have done that? ` #Content { background-color: white; padding: 10px; position: relative; top: 136px; } ` – Falling10fruit Nov 29 '21 at 01:08
  • Hmm, okay, so which one of the CSS rules might have done that? – Falling10fruit Nov 29 '21 at 10:23