• 목록
  • 아래로
  • 위로

transform 속성을 이용해서 텍스트를 가운데 정렬을 했는데, 파폭에서는 창 크기가 줄어들면 글자 일부분이 사라지네요 ㄷㄷ 

 

left: 50%;

top: 50%;

transform:translateX(-50%) translateY(-50%)

이렇게 적용되어 있는 상태인데, 크롬에서는 창이 줄면 텍스트가 두 줄이 될지언정 사라지는 일은 없었는데, 파폭에서는 창이 줄어들면 텍스트가 사라지네요... ㄷㄷ 

작성자
국내산라이츄 102 Lv. (84%) 846200/848720EXP

인생은 양자역학이외다

댓글 11

NoYeah
profile image

transform 속성이 표준이 아니어서 그럴 겁니다.

 

많이 알려진 방법으로는 margin:auto; 값을 적용하는게 가장 많이 알려진 방법이고, html 태그로 감쌀 수 있다면

태그 안에 내용을 넣으면 가운데 정렬을 합니다.
comment menu
2017.09.12. 19:10

신고

"NoYeah님의 댓글"

이 댓글을 신고 하시겠습니까?

국내산라이츄 작성자 → NoYeah
profile image

(아니 왜때문에 아직도 표준이 아닌 게 존재하는거죠)

comment menu
2017.09.12. 19:10

신고

"국내산라이츄님의 댓글"

이 댓글을 신고 하시겠습니까?

NoYeah → 국내산라이츄
profile image

예전에 표준이 정해지기 전에 브라우저들마다 중구난방으로 태그를 사용하던 시절이 있었는데 그 잔여물이 아직 남아있는게 아닌가 싶네요.

comment menu
2017.09.12. 19:11

신고

"NoYeah님의 댓글"

이 댓글을 신고 하시겠습니까?

신고

"국내산라이츄님의 댓글"

이 댓글을 신고 하시겠습니까?

NoYeah → 국내산라이츄
profile image

근데 저도 잘 모름.

comment menu
2017.09.12. 19:13

신고

"NoYeah님의 댓글"

이 댓글을 신고 하시겠습니까?

국내산라이츄 작성자 → NoYeah
profile image

결론은 브라우저들이 잘못한걸로... (음?)

comment menu
2017.09.12. 19:14

신고

"국내산라이츄님의 댓글"

이 댓글을 신고 하시겠습니까?

NoYeah → 국내산라이츄
profile image

그래서 브라우저들이 동시에 사용하기로 함 표준이 좋은 겁니다

comment menu
2017.09.12. 19:24

신고

"NoYeah님의 댓글"

이 댓글을 신고 하시겠습니까?

국내산라이츄 작성자 → NoYeah
profile image

아 그렇군요... 아참 트랜스폼은 width를 100프로로 해서 잡았습니다.

comment menu
2017.09.12. 21:14

신고

"국내산라이츄님의 댓글"

이 댓글을 신고 하시겠습니까?

마카롱
profile image

그냥 css는 짜증나는걸로 ㅎㅎ

comment menu
2017.09.13. 16:44

신고

"마카롱님의 댓글"

이 댓글을 신고 하시겠습니까?

신고

"국내산라이츄님의 댓글"

이 댓글을 신고 하시겠습니까?

NoYeah → 마카롱
profile image

맞아요.

이 속성 적용하면 다른곳에서 삐걱하고 그거 고치면 다른곳에서 삐걱하고...

comment menu
2017.09.14. 10:07

신고

"NoYeah님의 댓글"

이 댓글을 신고 하시겠습니까?

권한이 없습니다.
번호 제목 글쓴이 날짜 조회 수
공지 [1차 해결 및 추가] 서버 접속 불가 문제 안내 12 마스터 24.06.20.15:22 579
공지 [작업 완료] 설 명절 맞이 서버 업데이트 안내 3 마스터 24.02.11.17:21 2566
공지 [중요] 호스팅 만료와 관련하여 일부 수칙이 변경됩니다. 4 마스터 23.01.14.02:23 6265
공지 [필독] 질문하는 방법 17 마스터 18.02.23.03:09 4650
646 프로그래머스 코딩테스트 연습에서 효율성 심사를 통과하려면 어떻게 해야할까요? 2 이니스프리 19.12.18.01:55 2875
645 논논비요리 만화책을 보려고 하는데 일본어를 얼마나 공부해야 될까요? 4 image 이니스프리 19.12.15.16:38 462
644 머신러닝 오프라인 강좌를 수강해보려고 하는데요~ 이거 괜찮을까요? 5 image 이니스프리 19.12.11.03:12 315
643 프로그래머스의 코딩테스트 연습과 COS PRO 난이도에 대해 질문 드립니다. 5 이니스프리 19.12.08.22:26 442
642 Crontab에서 파이썬 실행이 시간적으로 겹치는 것과 관련하여 질문 드립니다 ^^ 이니스프리 19.12.06.01:06 1374
641 [파이썬] 롯데백화점 크롤링과 관련하여 질문을 드립니다 2 image 이니스프리 19.12.04.21:56 268
640 노트북 발열 문제를 잘 잡는 분 계실까요? 6 이니스프리 19.12.04.19:04 235
639 데스크탑이냐 랩탑이냐, 그것이 문제입니다. 29 네모 19.11.28.14:15 333
638 error page 설정은 어떻해야할까요? 2 슬기 19.11.24.21:27 230
637 Amazon, Jomashop 등 대형 사이트에서는 크롤러를 어떻게 감지하나요? 10 이니스프리 19.11.24.15:12 1738
636 기계식 키보드 추천을 부탁드립니다! 20 갱생협스 19.11.24.12:56 244
635 네이버 사전을 크롤링할 때 한자의 인코딩 관련 하여 질문 드립니다. (일부 한자만 깨지는 현상) 21 image 이니스프리 19.11.22.16:22 1256
634 윈도우 NTFS에서 확장자의 대소문자가 구별되나요? (파이썬 pathlib.Path(file).suffix 관련) 9 이니스프리 19.11.19.00:50 1395
633 코딩 컨벤션상 전역변수와 지역변수의 변수명을 동일하게 하는 것이 무방한가요? 4 이니스프리 19.11.17.18:09 312
632 카카오 API OCR의 인식률은 어떤가요? 1 이니스프리 19.11.16.22:31 1588
631 3.5인치 외장하드 케이스에 SSD를 연결하면 전압과 관련된 문제가 발생할까요? 3 이니스프리 19.11.16.02:04 417
630 국내 유료 웹호스팅 사이트 추천을 부탁드립니다 14 이니스프리 19.11.16.00:09 335
629 윈도우7 익스플로러11에서 인터넷옵션/시작옵션/마지막 세션의 탭으로 시작이 작동이 안됩니다. 3 kyhsyou 19.11.15.10:54 301
628 구글 애드센스 잘아시는분 있나유? 2 슬기 19.11.14.23:54 222
627 스포어 호스팅 사용 중에 실수로 반복문을 잘못 돌리면 계정이 정지되나요? ㅠㅠ 2 이니스프리 19.11.14.00:25 185