# Is is possible to add a break/space here and make a new CSS box?
**URL:** https://meta.discourse.org/t/is-is-possible-to-add-a-break-space-here-and-make-a-new-css-box/301281
**Category:** Development
**Tags:** css
**Created:** [March 28, 2024, 3:48am UTC](https://meta.discourse.org/t/is-is-possible-to-add-a-break-space-here-and-make-a-new-css-box/301281 "2024-03-28T03:48:35Z")
**Posts on this page:** 7
**Page:** 1
### Author:  [@45thj5ej](https://meta.discourse.org/u/45thj5ej)
#### Post date: [March 28, 2024, 3:48am UTC](https://meta.discourse.org/t/is-is-possible-to-add-a-break-space-here-and-make-a-new-css-box/301281/1 "2024-03-28T03:48:35Z")
No idea how to explain this, so here’s a photo:
Where the red box is, I would like to have a separate “box/bubble” for the “New & Unread Topics” area. Where the squiggly red line is, I would like that area to be space, and then under the “Tracking” bell icon, have that be its own “box/bubble” too. Basically, trying to make this be two rounded borders with space between them. Essentially, just trying to detach the “New & Unread Topics” area from what’s right above it. Is this possible? If so, please tell me how.
It looks like the Topics area has a div ID of `suggested-topics` with a div class of `more-topics__list` and I believe the entire rounded box that’s already surrounding all of it is `main-outlet` but I can’t tell which one the above area is where the Tracking bell icon is.
So, I want it to look like this:
Red boxes indicate the “boxes/bubbles” I referred to above. Orange line between them is where I want the space between them to be. And yes, I’ve read all the usually-recommended CSS topics and whatnot. I cannot figure it out after like 6hrs. From messing around, it looks like if I do:
```plaintext
.more-topics__list{
display:none;
}
```
then it basically gets rid of all the stuff between Tracking bell icon and “Want to read more?..” at the bottom, but that doesn’t really help me get anywhere when I want to keep the content, just have the sections split.
---
### Author:  [@manuel](https://meta.discourse.org/u/manuel)
#### Post date: [March 28, 2024, 7:11am UTC](https://meta.discourse.org/t/is-is-possible-to-add-a-break-space-here-and-make-a-new-css-box/301281/2 "2024-03-28T07:11:14Z")
To split the sections into two containers you’d need to change the underlying template. I don’t think you can tweak the default one with CSS only, because:
> [@45thj5ej](#):
>
> surrounding all of it is `main-outlet`
and there’s no other wrapper on the default template.
---
### Author:  [@pfaffman](https://meta.discourse.org/u/pfaffman)
#### Post date: [March 28, 2024, 9:31am UTC](https://meta.discourse.org/t/is-is-possible-to-add-a-break-space-here-and-make-a-new-css-box/301281/3 "2024-03-28T09:31:16Z")
You can check if there is a plugin outlet there
---
### Author:  [@Don](https://meta.discourse.org/u/Don)
#### Post date: [March 28, 2024, 12:18pm UTC](https://meta.discourse.org/t/is-is-possible-to-add-a-break-space-here-and-make-a-new-css-box/301281/4 "2024-03-28T12:18:05Z")
Hello 👋
I assume you are using the [☁ Discourse Air Theme](https://meta.discourse.org/t/discourse-air-theme/197703).
Something like this, you can achieve it.
Common CSS
```scss
body.archetype-regular,
body.archetype-banner,
body.archetype-private_message {
#main-outlet {
margin-top: 30px;
margin-bottom: 0px;
background: transparent !important;
box-shadow: none;
padding: 0em 0em 5%;
width: 100% !important;
#topic-title {
margin-bottom: 0;
background: var(--secondary);
padding: 3em 3em 1em;
border-radius: 1em 1em 0 0;
}
.container.posts {
margin-bottom: 0;
background: var(--secondary);
padding: 0 3em var(--below-topic-margin);
}
.topic-above-footer-buttons-outlet.presence {
margin: 0;
padding: var(--below-topic-margin) 0;
background: var(--secondary);
}
#topic-footer-buttons {
max-width: 100%;
background: var(--secondary);
border-radius: 0 0 1em 1em;
margin: 0;
padding: var(--below-topic-margin) 3em 1em;
}
.more-topics__container {
border-radius: 1em;
background: var(--secondary);
max-width: 100%;
padding: 3em;
}
}
}
```
---
### Author:  [@manuel](https://meta.discourse.org/u/manuel)
#### Post date: [March 28, 2024, 12:32pm UTC](https://meta.discourse.org/t/is-is-possible-to-add-a-break-space-here-and-make-a-new-css-box/301281/5 "2024-03-28T12:32:18Z")
Haha, that’s the option I wouldn’t consider for the amount of work! Well done @Don 🎉
---
### Author:  [@45thj5ej](https://meta.discourse.org/u/45thj5ej)
#### Post date: [March 28, 2024, 1:06pm UTC](https://meta.discourse.org/t/is-is-possible-to-add-a-break-space-here-and-make-a-new-css-box/301281/6 "2024-03-28T13:06:46Z")
Thanks a ton for this reply!
---
### Author:  [@system](https://meta.discourse.org/u/system)
#### Post date: [April 27, 2024, 1:07pm UTC](https://meta.discourse.org/t/is-is-possible-to-add-a-break-space-here-and-make-a-new-css-box/301281/7 "2024-04-27T13:07:38Z")
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.