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

이미지 오른편에 텍스트를 넣고 싶습니다 채택완료

ango 8년 전 조회 4,084

안녕하세요 냑여러분 -_-;;

 

아래 처럼 이미지 오른편에 텍스트를 넣고 싶은데요.

HTML과 CSS를 어떻게 짜야할지 도저히 모르겠습니다.

float: left 말고 다른 방법이 있나요?

 

http://red2.net/other2/about_us.html">http://red2.net/other2/about_us.html

 

 

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

답변 7개

채택된 답변
+20 포인트
nanati
8년 전

img를 감싼 p에

display: inline-block;

vertical-align: top;

값을 주시고,

 

나머지 오른쪽에 자리하고 싶은 텍스트를 전부 div로 묶어 

div에 display: inline-block; 값을 주면 가능합니다.

로그인 후 평가할 수 있습니다

답변에 대한 댓글 2개

s
sinbi
8년 전
테스트해봤는데 안 먹히는 것 같아요.
https://codepen.io/sinbi/pen/mqERBe
n
nanati
8년 전
@sinbi http://red2.net/other2/about_us.html
요 사이트 내에서 해보면 되는디용... 뭐징...ㅎ

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

메인링크

많이 배워갑니다 .. 고맙습니다.

로그인 후 평가할 수 있습니다

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

8년 전

모두 정말 고맙습니다.

 

안되다가 할수없이 flex 써서 해결했네요;;

로그인 후 평가할 수 있습니다

답변에 대한 댓글 2개

n
nanati
8년 전
그런데 왜 float: left 를 안쓰시고 처리하시려고 하셨던거예요?
a
ango
8년 전
clear 하기가 귀찮아서 -_-;;

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

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

f
8년 전

테이블로 구성

 

<tr>

    <td colspan="4" width="100%" valign="top"">

        <img src="./img/church_7.png" alt="사목회장" align="left" hspace="5" vspace="5">

        <p style="text-align:justify">사랑하는 형제자매 여러분!


        


          본인은 이번 사목협의회 회장이라는 중책을 맡았습니다. 예수님께서 걸으신 그 숭고하고 거룩한 정신을 이어받아 "나에게 힘을 주시는 분 안에서 나는 모든 일을 할 수 있습니다"(필리피서 4장 13절)라는 고귀한 성경 말씀처럼 사목협의회 회장으로서 모든 책무를 충실히 이행하고, 주임 신부님의 사목지침과 방침을 충실히 따르고 이행하면서 보다 발전된 모습을 보일 수 있도록 최선을 다하겠습니다.


          형제자매 여러분들의 깊은 관심과 애정 그리고 협조를 부탁드립니다.
</p>

        <p style="text-align:right">17대 사목회장 <b>손ㅇㅇ ㅇㅇㅇ</b></p>

    </td>

</tr>

 

실제 제가 관리하는 사이트 소스입니다.

 

이미지는 align="left"

텍스트와의 간격 hspace="5" vspace="5"

텍스트는 좌우 끝단을 맞춰줍니다 style="text-align:justify"

로그인 후 평가할 수 있습니다

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

s
sinbi Expert
8년 전
로그인 후 평가할 수 있습니다

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

8년 전

제일 쉬운건 테이블 구성해서 하는게 편하죠..

기타 여백은 다 0으로 맞춘뒤에 이미지는 td 에 background 로 넣으시면 편합니다.

로그인 후 평가할 수 있습니다

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

답변을 작성하려면 로그인이 필요합니다.

로그인