To make the main wrapper stretch to its content and get rid of overflow, you can use the following CSS properties:
1. `display: inline-block;` or `display: inline;` for the main wrapper.
2. `white-space: nowrap;` for preventing line breaks within the main wrapper content.
Here's an example of how you can achieve this:
HTML:
```html
<div class="main-wrapper">
This is the content that you want to stretch the wrapper to fit.
</div>
```
CSS:
```css
.main-wrapper {
display: inline-block; /* Use inline-block to make the wrapper size adjust to content */
white-space: nowrap; /* Prevent line breaks within the content */
border: 1px solid #000; /* Just for visual reference, you can remove this */
padding: 10px; /* Add padding for spacing around content */
}
```
In this example, the `main-wrapper` div will adjust its width to fit the content inside it, and it won't cause an overflow. If the content is too long, it won't break into a new line due to the `white-space: nowrap;` property.
Remember to adjust the styling, such as borders and padding, to match your design requirements.