Archived topic
How to add a border for each container?
5 replies · Started by Dipak Singh on March 2, 2021
Hey, I am really loving GP and it's amazing.
I am using a code
.inside-article {
border: 1px solid #ccc;
}
.inside-right-sidebar {
border: 1px solid #ccc;
}
.site-footer .footer-widgets {
border: 1px solid #ccc;
}
to make borders but recently I am seeing it's not working in the comment box and each sidebar widget.
It is working as a single container border in the sidebar widget.
please suggest making a border for each sidebar widget separate.
Hi there,
Can you link us to the page you're working on?
Also, can you specify which containers you would like to the border on? So we could use the proper selectors and avoid other containers from being styled.
You can use the private information text field to provide the site links/details.
Hey Elvin, I am sending my website link, please see the right sidebar where are two widgets with a border. But they are in a single border container and I want a separate border container for each widget.
And in this way, this is not looking good.
Hi there,
To make the border apply to individual sidebar widgets, you should change this CSS you have on your site:
.inside-right-sidebar {
border-width: 1px;
border-style: solid;
border-color: rgb(204, 204, 204);
border-image: initial;
}To this:
.inside-right-sidebar .widget {
border-width: 1px;
border-style: solid;
border-color: rgb(204, 204, 204);
border-image: initial;
}Hey thanks for it, it's working.
.inside-right-sidebar .widget {
border: 1px solid #ccc;
}
like this
You can completely change or add any css property you prefer as long as the selectors are intact, the syntaxes are correct and the values are valid.
No problem. :)
