The most up-to-date CSS will be using the Device Posture API. MDN Reference | Device Posture API.
At the time of writing it comes with Limited Support, and offers device posture: folded or continuous.
@media (device-posture: folded) and (orientation: landscape) {
.list-view {
margin-inline-end: 60px;
}
}
@media (device-posture: folded) and (orientation: portrait) {
.list-view {
margin-block-end: 60px;
}
}
For folded phones, another CSS @media query for horizontal-viewport-segments
and vertical-viewport-segments
is under work, which shall allow flip phones (and double flip phones) getting a native CSS media query support.
More info here: Foldable APIs
@media (horizontal-viewport-segments: 2) {
/* Your CSS here */
}
Web.dev also has great examples of sectioning of content based on folded and continuous modes which shows how to use the query for any folded phones (including the galaxy mentioned in your question). More about Screen Configurations here.