2013-07-03 2 views
0

꽤 많은 데이터가 포함 된 페이지에서 작업하고 있으므로 페이지가 실제로 길어집니다. 페이지는 본체의 배경 이미지와 배경 이미지가있는 컨테이너로 구성되며 페이지의 전체 길이 (위쪽 여백이나 아래쪽 여백이 아니며 위쪽 또는 아래쪽 여백 없음)를 실행합니다. 배경 이미지에 문제가 있습니다. 특정 해상도에서 페이지의 맨 아래로 확장되지 않습니다. 내가 코딩하는 화면은 1680 픽셀이고 현재 두 배경 이미지가 맨 아래까지 펼쳐져 있습니다. 그러나 1280px 너비와 같이 작은 해상도의 화면에서 페이지를 볼 때 배경 이미지가 맨 아래까지 확장되지 않습니다.배경 이미지가 페이지 하단으로 확장되지 않음

저는 XHTML 1.0 Strict를 사용하고 있습니다.

다음
<body class="ice01"> 
<div id="maincontent2"> 
<!-- content --> 
</div> 
</body> 

가 관련 CSS 코드입니다 : 내 창의 크기를 조절하면

.ice01 { 
background-image: url('../images/iceBackground04.jpg') ; 
    margin: 0 100px; 
font-family: book antiqua; 
font-size: 19px; 
color: #12124c;} 


#maincontent { 
width: 88%; 
background-image: url(../Images/BlueParchment.jpg); 
margin: 0px auto; 
padding: 0px 32px 0px 32px;} 

이 문제는 또한 자체를 제공

여기에 관련 HTML 코드입니다. 또한 배경 이미지를 꺼내 색상으로 대체하면이 문제가 사라집니다. 나는 속기 (background: #0000ff url('../images/iceBackground04.jpg') repeat 0 0;)를 사용하여 시험해 보았는데, 문제가 해결되지 않는다.

모두 min-height: 100%;을 사용해 보았지만 문제가 해결되지 않았습니다. 또한 W3C를 통해 웹 페이지의 유효성을 검사했으며이 태그가 누락 된/닫히지 않은 태그로 인해 발생하지 않는다고 생각합니다. 여기

는 해당 페이지의 URL입니다 : 나는 "다시"CSS 파일을 사용하지만, 그래도 문제가 해결되지 않을 제거하고 http://icengale.com/icenDeities-Mainen.html

, 그래서 나는 그 문제를 일으키는 것으로 생각하지 않습니다.

모든 도움을 주시면 감사하겠습니다.

+0

반복적 인 y 속성을 사용 했습니까? –

+0

은 Firefox에서 잘 작동합니다. – JanR

+1

Working fine ...! –

답변

0

작동하는 경우 다음 CSS를 사용해보세요.

.ice01 { 
background:url(../images/iceBackground04.jpg) repeat-x 0 0; 
margin: 0 100px; 
font-family: book antiqua; 
font-size: 19px; 
color: #12124c;} 


#maincontent { 
width: 88%; 
background:url(../images/BlueParchment.jpg) repeat-x 0 0; 
margin: 0px auto; 
padding: 0px 32px 0px 32px;} 
+0

그것은 작동하지 않았다, Swarnamayee Mallia. 그것은 내가 약간의 테스트를하도록 고무 시켰고, 배경 이미지는 약 32,750px (배경 이미지에 테두리를 추가하고 그것이 반복되는 횟수를 세었습니다)에서 멈추고 있습니다. 그리고 그것은 Firefox에서 잠시 멈춘다. IE8에서는 정상적으로 표시됩니다. 나는 다른 어떤 시험도하지 않았다. – Mock26

관련 문제