Submit button은 고정된 상황에서 창의 크기에 따라 Input box 의 넒이만 바꾸게 하고 싶어요.

TechNote Forum Forums Forum Submit button은 고정된 상황에서 창의 크기에 따라 Input box 의 넒이만 바꾸게 하고 싶어요.

This topic contains 1 reply, has 2 voices, and was last updated by  kakao.q 11 months, 3 weeks ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #903

    technote
    Keymaster

    접속하는 기기에 따라 해상도가 다른데 버튼의 크기도 상대적으로 같이 바뀌어 UI 구성이 쉽지 않습니다.

    버튼은 고정된 상황에서 입력받는 Input box만 자동조절되게 하려면 어떻게 해야 하나요?

     

    • This topic was modified 11 months, 3 weeks ago by  technote.

    #904

    kakao.q
    Participant

    http://jsfiddle.net/v7YTT/4281/

     

    위 링크의 예제를 보면 원하는 대로 적용할 수 있습니다.

    [HTML]

    <form method="post">
    <button>Search</button>
    <span><input type="text" title="Search" /></span>
    </form>

     

    [CSS]

    form{
      width: 100%;
      overflow: hidden;
      background-color: yellow;
    }
    
    input{
      width: 100%
    }
    span {
      display: block;
      overflow: hidden;
      padding-right:10px;
    }
    
    button{
      float: right;
    }

     

    input box를 span tag로 한번 더 감싸서 원하는 효과를 만들어 낼 수 있습니다.

    • This reply was modified 11 months, 3 weeks ago by  technote.
Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.