<div id="readability-page-1" class="page"><div>갤럭시 폴드4 (Galaxy Fold 4) 가로폭
- 접힌 상태 : 345px
- 펼친 상태 : 691px
<figure>
 <span data-url="https://blog.kakaocdn.net/dn/kF6C7/btsAnz0HR4H/ix60CTnVskVFtiwSxAcbW0/img.jpg" data-lightbox="lightbox" data-is-animation="false" data-origin-width="1126" data-origin-height="1500" data-filename="IMG_4319.jpeg" data-widthpercent="50"><img src="https://blog.kakaocdn.net/dn/kF6C7/btsAnz0HR4H/ix60CTnVskVFtiwSxAcbW0/img.jpg" onerror="this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';"><span data-url="https://blog.kakaocdn.net/dn/DyTqx/btsAiEbqbaR/IGf1wX3UwKjn184jYf1rK1/img.jpg" data-lightbox="lightbox" data-is-animation="false" data-origin-width="1126" data-origin-height="1500" data-filename="IMG_4318.jpeg" data-widthpercent="50"><img src="https://blog.kakaocdn.net/dn/DyTqx/btsAiEbqbaR/IGf1wX3UwKjn184jYf1rK1/img.jpg" onerror="this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';">
 <figcaption>높이값은 코드펜 헤더 포함이라 +65px 해야합니다. 가로폭만 참고해주세요.</figcaption>
</figure>



디바이스에서 아래 URL에 접속하면 직접 테스트 해 볼 수 있습니다.
<a href="https://codepen.io/zineeworld/full/OJdxjoP">[test] viewport / userAgent (codepen.io)</a>
<figure id="og_1700020870228" contenteditable="false" data-ke-type="opengraph" data-ke-align="alignCenter" data-og-type="website" data-og-title="[test] viewport / userAgent" data-og-description="..." data-og-host="codepen.io" data-og-source-url="https://codepen.io/zineeworld/full/OJdxjoP" data-og-url="https://codepen.io/zineeworld/details/OJdxjoP" data-og-image="https://scrap.kakaocdn.net/dn/c0sFQ0/hyUuXg8x1b/CE7bq346VSzJcAVF8quOf0/img.jpg?width=800&amp;height=450&amp;face=0_0_800_450,https://scrap.kakaocdn.net/dn/ch4oBC/hyUuYUDJ5m/XF7S8EAyEwyYBBnNuKqKkK/img.jpg?width=800&amp;height=450&amp;face=0_0_800_450"><a href="https://codepen.io/zineeworld/full/OJdxjoP" target="_blank" rel="noopener" data-source-url="https://codepen.io/zineeworld/full/OJdxjoP">

<div>
[test] viewport / userAgent
...
codepen.io
</div>
</a><img src="https://scrap.kakaocdn.net/dn/c0sFQ0/hyUuXg8x1b/CE7bq346VSzJcAVF8quOf0/img.jpg?width=800&amp;height=450&amp;face=0_0_800_450,https://scrap.kakaocdn.net/dn/ch4oBC/hyUuYUDJ5m/XF7S8EAyEwyYBBnNuKqKkK/img.jpg?width=800&amp;height=450&amp;face=0_0_800_450"></figure>

구글 인스펙터로 접힌 폭이 280px 인줄 알고 작업했는데, 실제 디바이스랑 달라서 확인해봤다.

따라서 폴드 대응을 위해 미디어쿼리를
@media screen and (max-width: 280px) { }로 잡았다면 적용이 안되고 있을 것!!!

처음에 갤폴드 280 이라도 들었을 때, 왜 이딴걸 만들어서 고통을 주나 싶었는데
이제는 반쪽 화면 해상도도 345 라니 다행이다 싶다 ㅋㅋ&nbsp;
<figure data-ke-mobilestyle="widthOrigin" data-origin-width="543" data-origin-height="748"><img src="https://blog.kakaocdn.net/dn/bsV2kY/btsAp1CmDZO/M7s9n3TZC7OKKSyDyZzq40/img.png" onerror="this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';" data-origin-width="543" data-origin-height="748"><figcaption>믿을게 못 됨!!!! 이건 진짜 폴드 첫 출시 당시 수준인 것 같다.</figcaption>
</figure>





기타 폴더블폰 사이즈
<a href="https://kang-ji.tistory.com/entry/Foldable-%ED%8F%B4%EB%8D%94%ED%8F%B0-%ED%95%B4%EC%83%81%EB%8F%84-Galaxy-%ED%94%8C%EB%A6%BD3-%ED%8F%B4%EB%93%9C3-%EB%AA%A8%EB%B0%94%EC%9D%BC-%EC%9B%B9">Galaxy Foldable 폴더폰 해상도 (Viewport) :: Kang-ji (tistory.com)</a>
<figure id="og_1700021059712" data-og-image="https://scrap.kakaocdn.net/dn/rKDnb/hyUyxOCp81/1oBBmB28t3nqNv7jvWaKX1/img.png?width=800&amp;height=800&amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/bwcugE/hyUuZ0jrxQ/JvuIRGQh9PNzjvgYeGD2l0/img.png?width=800&amp;height=800&amp;face=0_0_800_800" data-og-url="https://kang-ji.tistory.com/entry/Foldable-%ED%8F%B4%EB%8D%94%ED%8F%B0-%ED%95%B4%EC%83%81%EB%8F%84-Galaxy-%ED%94%8C%EB%A6%BD3-%ED%8F%B4%EB%93%9C3-%EB%AA%A8%EB%B0%94%EC%9D%BC-%EC%9B%B9" data-og-source-url="https://kang-ji.tistory.com/entry/Foldable-%ED%8F%B4%EB%8D%94%ED%8F%B0-%ED%95%B4%EC%83%81%EB%8F%84-Galaxy-%ED%94%8C%EB%A6%BD3-%ED%8F%B4%EB%93%9C3-%EB%AA%A8%EB%B0%94%EC%9D%BC-%EC%9B%B9" data-og-host="kang-ji.tistory.com" data-og-description="폴더블 폰 모바일웹 브라우저 해상도 정보 기종 Viewport 화면 사이즈 (W x H) 해상도 Phys. (W x H) 인치 DPR (Device Pixel Ratio) Galaxy Flip4 412 x 1006 1081.5 x 2640.75 Galaxy Flip3 384 x 939 1080 x 2640 260 x 512 6.7 2.8125 Galax" data-og-title="Galaxy Foldable 폴더폰 해상도 (Viewport)" data-og-type="article" data-ke-align="alignCenter" data-ke-type="opengraph"><a href="https://kang-ji.tistory.com/entry/Foldable-%ED%8F%B4%EB%8D%94%ED%8F%B0-%ED%95%B4%EC%83%81%EB%8F%84-Galaxy-%ED%94%8C%EB%A6%BD3-%ED%8F%B4%EB%93%9C3-%EB%AA%A8%EB%B0%94%EC%9D%BC-%EC%9B%B9" data-source-url="https://kang-ji.tistory.com/entry/Foldable-%ED%8F%B4%EB%8D%94%ED%8F%B0-%ED%95%B4%EC%83%81%EB%8F%84-Galaxy-%ED%94%8C%EB%A6%BD3-%ED%8F%B4%EB%93%9C3-%EB%AA%A8%EB%B0%94%EC%9D%BC-%EC%9B%B9">

<div>
Galaxy Foldable 폴더폰 해상도 (Viewport)
폴더블 폰 모바일웹 브라우저 해상도 정보 기종 Viewport 화면 사이즈 (W x H) 해상도 Phys. (W x H) 인치 DPR (Device Pixel Ratio) Galaxy Flip4 412 x 1006 1081.5 x 2640.75 Galaxy Flip3 384 x 939 1080 x 2640 260 x 512 6.7 2.8125 Galax
kang-ji.tistory.com
</div>
</a><img src="https://scrap.kakaocdn.net/dn/rKDnb/hyUyxOCp81/1oBBmB28t3nqNv7jvWaKX1/img.png?width=800&amp;height=800&amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/bwcugE/hyUuZ0jrxQ/JvuIRGQh9PNzjvgYeGD2l0/img.png?width=800&amp;height=800&amp;face=0_0_800_800"></figure>
</div></div>

zineeworld

갤럭시 폴드4 (Galaxy Fold 4) 가로폭
- 접힌 상태 : 345px
- 펼친 상태 : 691px
 
 
디바이스에서 아래 URL에 접속하면 직접 테스트 해 볼 수 있습니다.
[test] viewport / userAgent (codepen.io)
 
구글 인스펙터로 접힌 폭이 280px 인줄 알고 작업했는데, 실제 디바이스랑 달라서 확인해봤다.
 
따라서 폴드 대응을 위해 미디어쿼리를
@media screen and (max-width: 280px) { }로 잡았다면 적용이 안되고 있을 것!!!
 
처음에 갤폴드 280 이라도 들었을 때, 왜 이딴걸 만들어서 고통을 주나 싶었는데
이제는 반쪽 화면 해상도도 345 라니 다행이다 싶다 ㅋㅋ 
 
 
 
 
기타 폴더블폰 사이즈
Galaxy Foldable 폴더폰 해상도 (Viewport) :: Kang-ji (tistory.com)

[모바일 해상도] 갤럭시 폴드4 viewport 사이즈, 모바일 해상도 확인하기

댓글