부모와 자녀의 CSS 문제 (콘텐츠 배경이 올바르게 레이아웃되지 않음)

Question

웹 사이트의 콘텐츠 섹션을 만들고 있는데, 왼쪽, 오른쪽 등을 사용하여 나란히 배치 할 수 있는지 테스트하고 싶습니다. ... 내 웹 사이트에서 서로 옆에 2 개의 상자를 얻을 수 있었지만 배경 컨테이너는 1000px에 상자가없고 전체 콘텐츠 배경을 채 웁니다. 일단 당신이 내 사이트를 보면 당신은 이해할 것이다 ... 나는 문제가 내 CSS에 있다는 것을 알고있다. 제발 도와주세요. 내 사이트의 나머지 부분은 내가 1000px 인 컨테이너를 만들었다면 그 배경이 100 %였습니다. 왜 그것이 최상위 배너와 도구 모음과 함께 작동했는지 지금은 작동하지 않는 이유는 모르겠다. 항상 감사드립니다!

사이트 :

http://www.nestudiosonline.com/test.php

HTML :

이

<div id="contentbackground"> 
    <div id="content"> 
    <div id="flashbanner"></div><div id="test"></div> 
    </div> 
    </div> 

CSS :

@charset "utf-8"; 

#contentbackground 
{ 
width:100%; 
height:auto; 
margin-top:0px; 
margin-left:0px; 
margin-bottom:0px; 
margin-right:0px; 
padding-top:0px; 
padding-left:0px; 
padding-bottom:0px; 
padding-right:0px; 
border:0 
} 

#content 
{ 
background-color:#FFF; 
/* for IE */ 
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; 
filter:alpha(opacity=80); 
/* CSS3 standard */ 
opacity:.8; 
width:1000px; 
height:auto; 
margin-top:0px; 
margin-left:auto; 
margin-bottom:0px; 
margin-right:auto; 
padding-top:10px; 
padding-left:5px; 
padding-bottom:5px; 
padding-right:5px; 
border:solid; 
border-width:1px 
} 

#flashbanner 
{ 
float:left; 
display:inline; 
width:500px; 
height:200px; 
margin:0px; 
padding:0px; 
border:solid; 
border-width:1px 
} 

#test 
{ 
float:right; 
width:400px; 
height:200px; 
margin:0px; 
padding:0px; 
border:solid; 
border-width:1px 
} 

Answer 1

내가 제대로 이해하고 있는지 확실하지 않습니다,하지만 당신의 #content에 overflow: hidden 퍼팅을해야한다 모든게 멋지다.

EDIT : 그리고 동일한 요소에 clear: both도 있습니다.

편집 : 나는 방화범이 끌려 변경 사항을 적용하고 잘 작동하는 것 같습니다.

Answer 2

#linksbackground 및 #content에 처음으로 overflow:hidden;을 추가하십시오. 그런 다음 신체의 배경을 설정했는지 이해해야하므로이 동작은 논리적입니다. 원하는 것을 얻으려면 body 태그 아래에 래퍼 div를 만들고 </body> 전에 닫아야합니다. 다음 #bodybackground에서 배경을 제거하려면 다음과 같은 속성

#wrapper { 
    background: url("../images/olddkeshant3.jpg") no-repeat scroll 0 0 transparent; 
    margin: 0 auto; 
    width: 1000px; 
} 

을이 DIV의 ID #wrapper을 지정하고 추가 할 수 있습니다.

배경을 특정 위치에 배치하려면 배경 속성의 위 값인 0 0을 필요에 맞게 바꿀 수 있습니다.

하는 백분율 X가 (수평) 또는 다운 다운 (수평 대)을 가로 지르는 점 X % 으로 이미지 또는 ( 수직 대) (대 세로) 요소의 패딩을 통해 포인트 X %의 정렬 상자. 예를 들어 '0 % 0 %'의 값 쌍을 사용하면 이미지 의 왼쪽 위 모서리가 패딩 상자의 왼쪽 상단 모서리 에 맞춰집니다. 값 쌍 '100 % 100 %'는 오른쪽 아래에 이미지의 오른쪽 하단에 오른쪽 모서리를 놓습니다. 패딩 상자의 모서리. 값 쌍인 '14 % 84 % '의 경우, 가로 방향 14 % 점과 세로 방향 84 % 아래의 점은 가로로 14 %, 뒤쪽에 84 % 점에 놓여집니다.

소스 : http://www.w3.org/TR/CSS2/colors.html#propdef-background-position