2
正在爲此掙扎。一切似乎都沒問題,但我無法將內容置於<div id="contacts">
和<div class="contacts2">
部分中。無法將div放在其他div標記中
我錯過了一些東西,並盯着它太久拿起它。希望這裏有人能夠發現我的問題。
下面的代碼:
<!--Start content wrapper-->
<div id="content">
<div id="contact_wrapper">
<!--**************Glenn and Cathy*****************-->
<div id="contacts">
<p class="text6">Administrative Staff</p><br /><br />
<div class="admin_list_img">
<img src="../images/staff_students/glenn.jpg" alt="Image of Dr. Glenn Wilson" />
</div>
<div class="admin_list">
<span class="text12b"><a href="http://www.usm.maine.edu/tech/glenn-wilson-0">Dr. Glenn Wilson</a></span> <br/>Associate Professor of Technology, Senior Research Scientist<br/><br/>
Office: 178 Science Building <br />Phone: (207)780-8045<br />Email: <a href="mailto:[email protected]"> gwilson@usm.maine.edu</a></div>
<div class="admin_list_img">
<img src="../images/staff_students/default3.jpg" alt="image of Cathy Virecci-Fana" />
</div>
<div class="admin_list">
<span class="text12b">Cathy Virecci-Fana</span> <br/>Grants, Contracts and Projects Coordinator<br/><br/>
Phone: (207)780-4782<br />Email: <a href="mailto:[email protected]">cfana@usm.maine.edu</a></span>
</div>
</div>
<!--**************Clare Congdon and Bruce Macloed*****************-->
<div class="contacts2">
<p class="text6">Principle Investigators</p><br /><br />
<div class="pi_list_img">
<img src="../images/staff_students/default3.jpg" alt="default image" />
</div>
<div class="pi_list">
<span class="text12b"><a href="http://www.usm.maine.edu/cos/clare-bates-congdon">Dr. Clare Congdon</a></span> <br/>Associate Professor of Computer Science<br /><br/>
Office: 228 Science Building <br />Phone: (207)228-8441<br />Email: <a href="mailto:[email protected]">congdon@usm.maine.edu</a></p>
</div>
<div class="pi_list_img">
<img src="../images/staff_students/default3.jpg" alt="default image" />
</div>
<div class="pi_list">
<span class="text12b"><a href="http://www.usm.maine.edu/cos/bruce-macleod">Dr. Bruce MacLeod</a></span> <br/>Associate Professor of Computer Science<br/><br/>
Office: 222 Science Building<br />Phone: (207)780-4285<br />Email: <a href="mailto:[email protected]">macleod@usm.maine.edu</a></p>
</div>
</div>
<!--**************David Briggs and Carl Blue *****************-->
<div class="contacts2">
<div class="pi_list_img">
<img src="../images/staff_students/default3.jpg" alt="default image" />
</div>
<div class="pi_list">
<span class="text12b"><a href="http://www.usm.maine.edu/cos/david-briggs">Dr. David Briggs</a></span> <br/>Associate Professor of Computer Science<br /><br/>
Office: 220 Science Building <br />Phone: (207)780-4723<br />Email: <a href="mailto:[email protected]">briggs@usm.maine.edu</a></p>
</div>
<div class="pi_list_img">
<img src="../images/staff_students/default3.jpg" alt="default image" />
</div>
<div class="pi_list">
<span class="text12b"><a href="http://www.usm.maine.edu/tech/carl-blue">Dr. Carl Blue</a></span> <br/>Associate Professor of Computer Science<br/><br/>
Office: Room 210 John Mitchell Center<br />Phone: (207)780-5391<br />Email: <a href="mailto:[email protected]">cblue@usm.maine.edu</a></p>
</div>
</div>
<!--**************David Bantz *****************-->
<div class="contacts2">
<div class="pi_list_img">
<img src="../images/staff_students/default3.jpg" alt="default image" />
</div>
<div class="pi_list">
<span class="text12b"><a href="http://www.usm.maine.edu/cos/david-bantz">Dr. David Bantz</a></span> <br/>Adjunct Professor<br /><br/>
Office: 226 Science Building <br />Phone: (207)780-8440<br />Email: <a href="mailto:[email protected]">bantz@usm.maine.edu</a></p>
</div>
</div>
</div>
</div>
______________________
#content{
width:100%;
max-width: 1000px;
height:100%;
padding: 0px;
margin-top: 0px;
margin-bottom: 5px;
margin-left: auto;
margin-right: auto;
text-align:center;
background-color:#fff;
border-top: 0px;
position:relative;
z-index:1px;
}
#contact_wrapper{
width: 100%;
min-width: 900px;
height: 350px;
position: relative;
margin-left: auto;
margin-right: auto;
background-color: #333;
text-align: center;
}
#contacts {
height:250px;
width:100%;
min-width: 870px;
font-family: arial,serif,Capitals,serif;
font-size: 18px;
margin-top: 25px;
margin-left: auto;
margin-right: auto;
position: relative;
text-align: center;
top: 70px;
background-color: #fff;
border-bottom: solid 1px;
border-top: solid 1px;
}
.text6 {
font-size: 18px;
font-family:arial,serif,Capitals,serif;
font-weight:0;
color: #000;
text-align: left;
margin-bottom: 0px;
padding-bottom: 0px;
}
.admin_list{
position: relative;
text-align:left;
font-size: 12px;
float: left;
width:23%;
height:150px;
background-color:#fff;
padding:0px;
margin: 0px 20px 0px 0px;
vertical-align: middle;
}
.admin_list_img{
position: relative;
text-align:center;
float: left;
background-color:#fff;
padding:0px;
margin: 0px 20px 0px 20px;
vertical-align: middle;
}
.contacts2 {
height:200px;
width:100%;
min-width: 870px;
font-family: arial,serif,Capitals,serif;
font-size: 18px;
margin-top: 15px;
margin-left: auto;
margin-right: auto;
position: relative;
text-align: center;
top: 70px;
background-color: #fff;
border-bottom: 0px;
border-top: 0px;
}
.pi_list{
position: relative;
text-align:left;
font-size: 12px;
float: left;
width:23%;
height:150px;
background-color:#fff;
padding:0px;
margin: 0px 20px 0px 0px;
vertical-align: middle;
}
.pi_list_img{
position: relative;
text-align:center;
float: left;
background-color:#fff;
padding:0px;
margin: 0px 20px 0px 30px;
vertical-align: middle;
}
你可以添加一些換行符在這裏和那裏,使代碼更易讀?目前這是一大塊可怕的文字。 – jakee
你想要居中什麼? – LukeP
哦,JSFiddle:http://jsfiddle.net/mpAy2/ – LukeP