diff --git a/packages/components/src/notice/style.scss b/packages/components/src/notice/style.scss
index 8474146bbec680..760b9f9fc3be1d 100644
--- a/packages/components/src/notice/style.scss
+++ b/packages/components/src/notice/style.scss
@@ -66,6 +66,7 @@
 .components-notice-list {
 	// The notice should never be wider than the viewport, or the close button might be hidden. Especially relevant at high zoom levels. Related to https://core.trac.wordpress.org/ticket/47603#ticket.
 	max-width: 100vw;
+	box-sizing: border-box;
 	z-index: z-index(".components-notice-list");
 
 	.components-notice__content {
diff --git a/packages/components/src/snackbar/style.scss b/packages/components/src/snackbar/style.scss
index 4357685ffa0cbd..013d7abed012e8 100644
--- a/packages/components/src/snackbar/style.scss
+++ b/packages/components/src/snackbar/style.scss
@@ -8,6 +8,7 @@
 	padding: 16px 24px;
 	width: 100%;
 	max-width: 600px;
+	box-sizing: border-box;
 	cursor: pointer;
 
 	@include break-small() {
@@ -54,6 +55,7 @@
 	position: absolute;
 	z-index: z-index(".components-snackbar-list");
 	width: 100%;
+	box-sizing: border-box;
 }
 
 .components-snackbar-list__notice-container {