0
웹 사이트를 완료했지만 문제가 있습니다. 사이드 바에 화면 왼쪽의 다른 페이지에 대한 링크가 녹색으로 표시되어 있습니다. 나머지 콘텐츠는 사이드 바의 오른쪽에 노란색으로 표시됩니다. 내가 겪고있는 문제는 사이트가 내 화면에서 잘 보이지만 크고 작은 해상도로 사이트를 볼 때 텍스트와 기타 콘텐츠가 사이드 바의 녹색으로 이동한다는 것입니다. 나는 몸의 너비를 100 %로 설정했습니다. 나는 그 문제가 무엇인지 확신 할 수 없다. CSS :웹 사이트 레이아웃 문제
body
{
background-image:url(Images/testbackground.jpg);
width:100%
}
#Links
{
float: left;
width: 10%;
margin: 0;
padding: 0;
height: 200px;
}
#ContentLayout
{
clear: right;
float: right;
width: 80%;
font-size:18px;
}
#wrapper
{
margin: 0 auto;
width:100%;
}
HTML :
<body>
<!--[if lte IE 6]>
<link rel="stylesheet" type="text/css" media="all" href="OldHome.css" />
<![endif]-->
<div id="wrapper">
<img src="Images/logo.jpg" name="Logo" id="Logo" />
<div id="Links">
<a href="index.html"><img src="Images/HomeLogo.jpg" alt="home" border="0px" /></a>
<br />
<a href="Programs.html"><img src="Images/ProgramsLogo.jpg" alt="programs" border="0px" /></a>
<br />
<a href ="Services.html"><img src="Images/ServicesLogo.jpg" alt="services" border="0px" /></a>
<br />
<a href ="Contact.html"><img src="Images/ContactLogo.jpg" alt="contact" border="0px" /></a>
<br />
<a href ="OtherLinks.html"><img src="Images/OtherLinksLogo.jpg" alt="links" border="0px" /></a>
<br />
<a href ="FAQ.html"><img src="Images/FAQLogo.jpg" alt="faq" border="0px" /></a>
<br />
<a href="Feedback.html"><img src="Images/FeedBackLogo.JPG" alt="feedback" border="0px" /></a>
<br />
<a href="Photos.html"><img src="Images/PhotosLogo.JPG" alt="photos" border="0px" /></a>
</div>
<div id="header">
<h1><center>
<u>Home</u>
<p><img src="Images/OutsideBld2.jpg" width="600" height="500" /></p>
</center></h1>
</div>
<div id="ContentLayout">
<h3 style="padding-left:30px"><center>Mission Statement</center></h3>
<p id="MissionStatement">The Employment Preparation Centre offers employment assistance programs and services to clients at no charge. These are available on a one-on-one basis or in group settings.
Programs and services at The Employment Preparation Centre are based on a belief that a person’s employability is enhanced through self-assessment, knowledge of the current labour market, and development of a return-to-work action plan.</p>
<p id="MissionStatement">
Programs and services at The Employment Preparation Centre are funded through the Department of Advanced Education and Skills under several key divisions.
</p>
<br />
<br />
<p>Trouble finding us?</p>
<!-- Google map START -->
<iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=10+Main+Street,+Corner+Brook&aq=&sll=39.017445,-98.196116&sspn=35.694805,86.044922&ie=UTF8&hq=&hnear=10+Main+St,+Corner+Brook,+Division+No.+5,+Newfoundland+and+Labrador+A2H+1C6,+Canada&t=m&z=14&ll=48.951917,-57.947721&output=embed"></iframe><br /><small><a href="http://maps.google.com/maps?f=q&source=embed&hl=en&geocode=&q=10+Main+Street,+Corner+Brook&aq=&sll=39.017445,-98.196116&sspn=35.694805,86.044922&ie=UTF8&hq=&hnear=10+Main+St,+Corner+Brook,+Division+No.+5,+Newfoundland+and+Labrador+A2H+1C6,+Canada&t=m&z=14&ll=48.951917,-57.947721" style="color:#0000FF;text-align:left">View Larger Map</a></small>
<!-- Google map END -->
<p>This page has <span><?=$hits;?></span> hits</p>
<address>
© 2012
</address>
</div>
</div>
<script type="text/javascript">
var $buoop = {}
$buoop.ol = window.onload;
window.onload=function(){
if ($buoop.ol) $buoop.ol();
var e = document.createElement("script");
e.setAttribute("type", "text/javascript");
e.setAttribute("src", "http://browser-update.org/update.js");
document.body.appendChild(e);
}
</script>
</body>
</html>
어쩌면 당신은 JSFiddle 수 있습니까? 감사. – fedosov
html도 유용합니다. –
도움이 되길 바랍니다. – TheAce