본문 바로가기

블록체인 기반 핀테크 및 응용 SW개발자 양성과정 일기

[20일차]20210409 fiverr 웹사이트 만들기 마지막

반응형

#inspired_wrap{
    width:100%;
    position:relative;
    height:670px;
    background-color: lightseagreen;

}


#inspired_box{
    width:1400px;
    height:575px;
    margin:0 auto;
    padding: 96px 32px;
    position: absolute;
    box-sizing: border-box;
    left:50%;
    transform: translateX(-50%);
    white-space: nowrap;
}

white space: nowrap; 기능을하면 박스 안에 contents 가 그대로 박스 밖까지 나옴

 



nowrap 2가지있는데


1.
position  dipplay block 형태로 레이아웃을 짤때

white-space :nowrap 을 통해서 떨구는것을 방지하는 방법있음

2. display:flex; 를 준 경우 
display:flex;
flex-wrap:nowrap

-> 
display
width:200px; 50px;

50px 50px 6개.


 

animation hover 시 잠시 멈추고 싶을 때

 

.inspired_moving:hover{

    animation-play-statepaused;

}

 

 

아주 유용 !! 

 

 

 

 

m.blog.naver.com/PostView.nhn?blogId=sudoku1&logNo=220868694364&proxyReferer=https:%2F%2Fwww.google.com%2F

 

프로그래머스 코딩 테스트 해보기 

반응형