테스트 사이트 - 개발 중인 베타 버전입니다

모바일에서 br태그 줄바꿈 기능 없애기

· 3년 전 · 4163 · 7

반응형을 제작하다 보면 pc에서는 줄바꿈을 넣어서 텍스트 표시하고 

모바일에서는 줄바꿈없이 표시해야 할 경우가 있죠.

 

그럴때 br을 강제로 없애는 방법도 있습니다. 

 

@media only screen and (max-width: 767px) {

    br{
       display:none !important;
    }

}

 

하지만 이렇게 하면 멋이 없죠 임폴턴트는 초보나 쓰는거니까요 

그리고 문단에 여백도 이쁘게 안나옵니다. 

 

@media only screen and (max-width: 767px) {

    br{
       display: inline-block;

       content: " ";

       padding: 0 2px;
    }

}

 

마침표 뒤에 다음 문장이 시작될때 약간의 띄어쓰기가 들어가고 br태그가 줄바꿈기능을 잃게 되었습니다. 

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

댓글 7개

pc mo 클래스 붙여서 none 하고 있었는데 좋은방법이네요!
3년 전
저는 비알 태그에도 속성을 넣을수있다란걸 잊고 살았나봐요 ㅋㅋㅋㅋ 저런방법도 있었다니 그냥 속성 없이 디폴트인줄 알았어요
@리오닥터 저도 몰랐었는데 편집기로 작성된 코드를 변경불가능하기에 고민하다보니 찾아낸거죠ㅎ
오 좋은 정보 감사합니다
꿀팁 감사합니다
3년 전
좋은 정보 감사합니다.

보고 배웁니다. ^^

게시글 목록

번호 제목
3381
3380
3379
3378
3377
3376
3375
3374
3373
3372
3371
3370
3369
3368
3367
3366
3365
3364
3363
3362
3361
3360
3359
3358
3357
3356
3355
3354
3351
3350