컨테이너 내에서 반응 형 DIV 중심화

사용자 3683675

화면 크기를 조정하면 divs가 반응하고 이동합니다. 오른손 div가 아래로 떨어지면 화면 오른쪽에 공간이 남습니다. 모든 divs가 왼쪽에 머 무르지 않고 자동으로 중앙에 배치 되기를 바랍니다.

설명을 돕기 위해이 JSFiddler를 만들었지 만 메시지와 함께 게시 할 수 없습니다. 아래에 게시됩니다.

도움이 필요하세요?

Paulie_D

플로트와 센터링을 사용하는 것은 매우 어렵습니다. display:inline-block대신 사용 text-align:center하고 래핑 부모에 추가하십시오 .

JSfiddle 데모

수정 된 CSS

#wrapper {
    max-width: 900px;
    margin: 0 auto;
    text-align:center; /* add this */
}

.box-container { 
    background: none repeat scroll 0 0 #FFFFFF;
    //float: left; /*tremove this */
    display: inline-block; /* add this */
    margin: 50px 5px 50px;
    overflow: hidden;
    position: relative;
    width: 185px;
    box-shadow: 0px 0px 5px #BBBBBB;
    text-align:center;
    text-decoration: none;

}

이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.

침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제

에서 수정
0

몇 마디 만하겠습니다

0리뷰
로그인참여 후 검토

관련 기사

분류에서Dev

중앙 및 반응 형 부트 스트랩 컨테이너 요소 옆에 div 푸시

분류에서Dev

CSS3에서 내부 원형 Div 중심화

분류에서Dev

컨테이너의 크기를 유지하면서 중앙 반응 형 이미지 크기 조정

분류에서Dev

jquery 중첩 div 컨테이너 내에서 div 찾기

분류에서Dev

CSS를 사용하는 반응 형 div에서 반응 형 이미지를 세로 중앙에 배치

분류에서Dev

div가 반응 형 웹 사이트에서 부모 배경을 이동하고 드러내는 것을 중지

분류에서Dev

반응 형 jQuery 슬라이더에서 축소되는 부모 컨테이너

분류에서Dev

상대적으로 배치 된 컨테이너 내에서 반응 형 이미지 만들기

분류에서Dev

JQuery : div 내에서 이미지 중심화

분류에서Dev

컨테이너의 높이와 너비에 테두리가있는 반응 형 삼각형

분류에서Dev

컨테이너의 높이와 너비에 테두리가있는 반응 형 삼각형

분류에서Dev

컨테이너 내에서 네이티브 컨테이너에 반응

분류에서Dev

반응 형 글꼴 크기 조정-컨테이너에 맞추기

분류에서Dev

내부 DIV의 높이를 존중하지 않는 반응 형 행

분류에서Dev

div 컨테이너를 반응 형으로 만드는 방법은 무엇입니까?

분류에서Dev

다른 반응 형 div 서클 안에 있고 중앙 집중식으로 반응하는 Div 서클?

분류에서Dev

div 내부에 여러 div가있는 반응 형 레이아웃

분류에서Dev

래퍼로 제한하면서 플렉스 컨테이너에 100 개의 "반응 형"div 사각형 (행당 10 개)을 갖는 방법은 무엇입니까?

분류에서Dev

부트 스트랩 반응 형 그리드의 중앙에 Div

분류에서Dev

반응 형 UI에서 마우스를 가져갈 때 다른 div의 이동 중지

분류에서Dev

컨테이너에 수직 및 수평으로 맞는 반응 형 이미지? (문제의 스크린 샷)

분류에서Dev

컨테이너 div 내에서 div를 중앙에 배치하려고합니다.

분류에서Dev

이미지 내부의 반응 형 div 버튼

분류에서Dev

미디어 쿼리없이 div가 다른 반응 형 div 내에서 반응하도록하려면 어떻게해야합니까?

분류에서Dev

flexbox 컨테이너의 반응 형 개츠비 이미지

분류에서Dev

전체 페이지 반응 형 컨테이너

분류에서Dev

중간 및 작은 화면에서 웹 페이지 반응 형 만들기

분류에서Dev

슬라이더 내부의 상자 div가 반응 형 페이지에서 정렬되지 않음

분류에서Dev

반응 형 DIV 내부에 포함 할 비례 이미지 배율 (너비 및 높이)

Related 관련 기사

  1. 1

    중앙 및 반응 형 부트 스트랩 컨테이너 요소 옆에 div 푸시

  2. 2

    CSS3에서 내부 원형 Div 중심화

  3. 3

    컨테이너의 크기를 유지하면서 중앙 반응 형 이미지 크기 조정

  4. 4

    jquery 중첩 div 컨테이너 내에서 div 찾기

  5. 5

    CSS를 사용하는 반응 형 div에서 반응 형 이미지를 세로 중앙에 배치

  6. 6

    div가 반응 형 웹 사이트에서 부모 배경을 이동하고 드러내는 것을 중지

  7. 7

    반응 형 jQuery 슬라이더에서 축소되는 부모 컨테이너

  8. 8

    상대적으로 배치 된 컨테이너 내에서 반응 형 이미지 만들기

  9. 9

    JQuery : div 내에서 이미지 중심화

  10. 10

    컨테이너의 높이와 너비에 테두리가있는 반응 형 삼각형

  11. 11

    컨테이너의 높이와 너비에 테두리가있는 반응 형 삼각형

  12. 12

    컨테이너 내에서 네이티브 컨테이너에 반응

  13. 13

    반응 형 글꼴 크기 조정-컨테이너에 맞추기

  14. 14

    내부 DIV의 높이를 존중하지 않는 반응 형 행

  15. 15

    div 컨테이너를 반응 형으로 만드는 방법은 무엇입니까?

  16. 16

    다른 반응 형 div 서클 안에 있고 중앙 집중식으로 반응하는 Div 서클?

  17. 17

    div 내부에 여러 div가있는 반응 형 레이아웃

  18. 18

    래퍼로 제한하면서 플렉스 컨테이너에 100 개의 "반응 형"div 사각형 (행당 10 개)을 갖는 방법은 무엇입니까?

  19. 19

    부트 스트랩 반응 형 그리드의 중앙에 Div

  20. 20

    반응 형 UI에서 마우스를 가져갈 때 다른 div의 이동 중지

  21. 21

    컨테이너에 수직 및 수평으로 맞는 반응 형 이미지? (문제의 스크린 샷)

  22. 22

    컨테이너 div 내에서 div를 중앙에 배치하려고합니다.

  23. 23

    이미지 내부의 반응 형 div 버튼

  24. 24

    미디어 쿼리없이 div가 다른 반응 형 div 내에서 반응하도록하려면 어떻게해야합니까?

  25. 25

    flexbox 컨테이너의 반응 형 개츠비 이미지

  26. 26

    전체 페이지 반응 형 컨테이너

  27. 27

    중간 및 작은 화면에서 웹 페이지 반응 형 만들기

  28. 28

    슬라이더 내부의 상자 div가 반응 형 페이지에서 정렬되지 않음

  29. 29

    반응 형 DIV 내부에 포함 할 비례 이미지 배율 (너비 및 높이)

뜨겁다태그

보관