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

스타일 질문입니다. 채택완료

검은아이 11년 전 조회 3,913

안녕하세요.

제가 스타일이나 퍼블리싱에 약하여 아래 문제를 해결하지 못하고 있어 질문드립니다.

왼쪽 "택배회사" 회색 글자 부분과 오른쪽 "택배회사 라디오 버튼과 회사이름 목록" 을 구분하려고 하는데요.

그림처럼 3번 회사 이름이 왼쪽으로 쏠립니다.

이 택배회사 명단을 1, 2번째처럼 오른쪽에 고정하고 싶습니다.

 

select 로 바꿔라~ 이런 답변은 사양할께요.

 




 

페이지는

</P>
<P>
         <div class="mp_left_100_aaa">택배회사</div>
         <div class="mp_right_450_222" style="margin-top:2px !important;;">
<?php</P>
<P>        //=========================================
        // 시작 => 반복문__돌리기
        WHILE (list($key, $val) = each($parcel_company_arr))
        {</P>
<P>         //=======================================
         // 시작 => 택배회사_이름__있으면
         IF ($val['name'])
         {
?>
          <input type="radio" name="parcel_company_s" id="reg_parcel_company_<?php echo $key; ?>" value="<?php echo $key; ?>"<?php  IF ($ord_parcel_company_s == $key) { echo " checked"; }  ?> /> <?php echo $val['name']; ?><label for="reg_parcel_company_<?php echo $key; ?>" class="sound_only">택배회사 - <?php echo $val['name']; ?></label>

<?php
         }
         // 끝 => 택배회사_이름__있으면
         //=======================================</P>
<P>        }
        // 끝 => 반복문__돌리기
        //=========================================</P>
<P>         ?></div>​</P>
<P> </P>
<P>

 

 

스타일은

​</P>
<P>
/* 왼쪽_칸 */
.mp_left_100_aaa {float:left; margin-bottom:8px; width:100px; height:100%; color:#aaa;}</P>
<P>
/* 오른쪽_칸 */
mp_right_450_222 {float:left; display:inline-block;margin-bottom:8px; width:450px; color:#222;}
​</P>
<P>

 

 

어떻게 해야 3번째 이후 택배회사도 1~2번째처럼 오른쪽에 고정할수 있을까요?

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

답변 2개

채택된 답변
+20 포인트

로 코딩하지말고 ul li를 사용하시면 영역분리가 편합니다

사각형으로 따지면 div는 혼자노는 사각형이고 li는 ul에 속한 사각형이므로 ul에 속한 li들은 height를 주지 않는다면 height가 같은 형태로 나갑니다

float:left만 사용한다면 위 문제 해결이 쉬울것 같습니다 

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

답변에 대한 댓글 1개

검은아이
11년 전
조언 감사합니다.
다음에는 ul li 사용해 볼께요.

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

11년 전

어제 밤에 해결을 못해서 전전긍긍하다가

방금 해결했습니다.

 

스타일에

mp_right_450_222

이거 앞에 점을 안찍었네요.

class 라 점을 하나 찍어줬어야 했는데요.

 

해결 못해 질문 남기고 바로 해결했네요. ㅡㅡ;;

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

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

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

로그인