div를 다른 div의 측면에 머물게하려면 어떻게해야합니까?

다른 div의 편에 div를 남기려하고 있습니다. 내 주요 부서가 페이지의 중앙에 있습니다. 나는 다른 쪽을 옆에두고 싶다. div를 다른 div의 측면에 머물게하려면 어떻게해야합니까?

body { 
    padding-top: 0px; 
    padding-bottom: 0px; 
    padding-left: 0px; 
    padding-right: 0px; 
    padding: 0px; 
    margin: 0px; 
    background: #000000; 
} 
#Home { 
    position: absolute; 
    top: 50%; 
    left: 50%; 
    margin-top: -128px; 
    margin-left: -128px; 
    width: 256px; 
    height: 256px; 
}

이 내가받은 얼마나 멀리 http://jsfiddle.net/vgd9yr5s/1/

<body> 
<div id="Home"> 
    <img src="Home.png" alt="Main div"> 
</div> 
<div id="Left"> 
    <img src="Left.png" alt="Left div"> 
</div>

. 초보자를위한 질문에 사과드립니다.

출처

2014-11-01 Draganko

CSS float 속성에 대해 다음 번에 Google에 질문을 올리기 전에 다음 번에 google을 참조하십시오. Refere [this] (http://stackoverflow.com/questions/18531895/how-to-make-two-divs-float-side-by-side) – M4ver1k

디스플레이를 살펴보십시오. 인라인 블록 역시보십시오. – Christina

절대 위치를 유지하려면 두 번째 div에 동일한 설정을 사용하고 margin-left: 0을 설정할 수 있습니다.

#Left { 
    position: absolute; 
    top: 50%; 
    left: 50%; 
    margin-top: -128px; 
    margin-left: 0; 
    width: 256px; 
    height: 256px; 
}

바이올린 : http://jsfiddle.net/vgd9yr5s/5/

출처

2014-11-01 19:45:45 emmanuel

감사합니다! 그것이 바로 내가 원하는 것입니다. 당신에게 명성! – Draganko

듣기 좋다. 환영합니다! – emmanuel

가 float:left CSS 속성을 사용합니다. 다음은 간단한 예제 페이지는 다음과 같습니다

<!DOCTYPE HTML> 
<html> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html;charset=utf-8"> 
     <title>Example Page</title> 
     <style>div {float:left; background:yellow; margin:3px;}</style> 
    </head> 
    <body> 
     <div>Hello, World!</div> 
     <div>Spam, Spam, wonderful spam...</div> 
    </body> 
</html>

출처

2014-11-01 19:47:19 GoBusto

http://jsfiddle.net/vgd9yr5s/4/ /당신은 사진을 볼 수 있습니다. 왼쪽 그림을 가운데에두기를 원합니다./

body { 
    padding-top: 0px; 
    padding-bottom: 0px; 
    padding-left: 0px; 
    padding-right: 0px; 
    padding: 0px; 
    margin: 0px; 
    background: #000000; 
} 
#Home { 
    position: relative; 
    float:right; 

    width: 256px; 
    height: 256px; 
} 
#left{ 
position:relative; 
    float:left; 


}

달성하려는 목표는 무엇입니까?

출처

2014-11-01 19:48:14

아니요, 슬프게도 그렇지 않습니다. ( – Draganko

div를 다른 div의 측면에 머물게하려면 어떻게해야합니까?

답변

관련 문제