two4god07
01-27-2009, 12:12 PM
On the staff page for the church, people are beginning to submit their bio's for me to place on the page. I've only received two so far.
On my computer, with the two bio's inserted, it looks fine. What I am afraid of is that on other people's computers, the font sizes vary. If the font size gets any bigger, they won't be able to read the entire bio because the text will be behind the image of the next staff member. Is there anyway I can preserve the current layout, but have all the content move down if the text gets too big?
CSS
#kim {position: absolute; top: 20px; left: 20px; height: 150px; width: 670px;}
#james {position: absolute; top: 180px; left: 20px; height: 150px; width: 670px;}
#cathy {position: absolute; top: 345px; left: 20px; height: 150px; width: 670px;}
#rowdy {position: absolute; top: 520px; left: 20px; height: 150px; width: 670px;}
#bob {position: absolute; top: 690px; left: 20px; height: 150px; width: 670px;}
#linda {position: absolute; top: 860px; left: 20px; height: 150px; width: 670px;}
#content {height: 1250px;}
.left {float: left; padding-right: 5px;}
.right {float: right;}
p {font-size: 60%; padding-top: 0px; padding-bottom: 0px; margin-top: 0px; margin-bottom: 0px;}
HTML
<body>
<div id="body">
<img src="indexbanner.jpg" id="banner" alt="Faith Miracle Ministry" />
<div id="toc">
<a href="index.html">Home</a> <br />
<a href="about.html">About Us</a> <br />
<a href="staff.html">Our Staff</a> <br />
<a href="events2.html">Upcoming Events</a> <br />
<a href="events.html">Outreach</a> <br />
<a href="counsel.html">Counseling</a> <br />
<a href="sermons.html">Sermons</a> <br />
<a href="contact.html">Contact Us</a> <br />
<a href="prayer.html">Prayer Requests</a> <br >
<a href="newsletter.html">Newsletter</a> <br />
<a href="http://www.faithmiracle.net/blog1">Pastor Speaks</a>
</div>
<div id="content">
<div id="kim"><img src="kim.jpg" height="150px" class="left" />
<span class="event">Senior Pastor</span>
<br /> Kimberly Britt
<p>I am married to a wonderful husband. Rowdy and I have 5 children who are all graduated and live on their own. I was born and raised in Hannibal/New London.I went down a long path of failures and addictions before realizing I was in need of a Saviour. In 1998 I hit my bottomless pit. I wanted something different, but was not sure what it was or how to get it. It wasn't until I called upon God to save me and ask him to give me the will to live that my life changed. God began to remove all the years of hurt and anger from me. There was one thing I had never realized keeping me in bondage, and that was "UNFORGIVENESS." When the Lord began to deal with my anger and revealing to me that I must forgive others to be forgiven I was sure I would go to Hell because there was no way I could forgive them. God began to change my heart about the way I felt. Not only did I find I could forgive others, I found that I could let go of the anger I had with God. I gave my heart and life to Christ on December 28, 1998 and today I am ever so grateful that when everyone gave up on me Jesus continued to want me. Now I serve God and seek to fulfill his will and command.</p>
</div>
<div id="james"><img src="james.jpg" height="150px" class="right" />
<span class="event">Associate Pastor</span>
<br />James Bridges</div>
<div id="cathy"><img src="cathy.jpg" height="150px" class="left" />
<span class="event">Youth Pastor</span>
<br />Cathy Haden</div>
<div id="rowdy"><img src="rowdy.jpg" height="150px" class="right" />
<span class="event">Elder</span>
<br />Rowdy Britt<p> Hi. I live on the outside of Hannibal, MO with my wife. We have 5 kids. I have been employed with Tri-State Equipment for 29 years. I enjoy restoring Studebakers and Jeep Willy's. I love to share time with my wife and kids when ever we can. My wife and I enjoy antiques and gardening. We spend alot of our time working in the church and trying to fulfill the needs of our church family as well as in our community. </p></div>
<div id="bob"><img src="bob.jpg" height="150" class="left" />
<span class="event">Elder</span>
<br />Bob Haden</div>
<div id="linda"><img src="choir.jpg" height="150px" class="right" />
<span class="event">Choir Director</span>
<br />Linda Malia</div>
</div></div>
</body></html>
Thank you for your time.
On my computer, with the two bio's inserted, it looks fine. What I am afraid of is that on other people's computers, the font sizes vary. If the font size gets any bigger, they won't be able to read the entire bio because the text will be behind the image of the next staff member. Is there anyway I can preserve the current layout, but have all the content move down if the text gets too big?
CSS
#kim {position: absolute; top: 20px; left: 20px; height: 150px; width: 670px;}
#james {position: absolute; top: 180px; left: 20px; height: 150px; width: 670px;}
#cathy {position: absolute; top: 345px; left: 20px; height: 150px; width: 670px;}
#rowdy {position: absolute; top: 520px; left: 20px; height: 150px; width: 670px;}
#bob {position: absolute; top: 690px; left: 20px; height: 150px; width: 670px;}
#linda {position: absolute; top: 860px; left: 20px; height: 150px; width: 670px;}
#content {height: 1250px;}
.left {float: left; padding-right: 5px;}
.right {float: right;}
p {font-size: 60%; padding-top: 0px; padding-bottom: 0px; margin-top: 0px; margin-bottom: 0px;}
HTML
<body>
<div id="body">
<img src="indexbanner.jpg" id="banner" alt="Faith Miracle Ministry" />
<div id="toc">
<a href="index.html">Home</a> <br />
<a href="about.html">About Us</a> <br />
<a href="staff.html">Our Staff</a> <br />
<a href="events2.html">Upcoming Events</a> <br />
<a href="events.html">Outreach</a> <br />
<a href="counsel.html">Counseling</a> <br />
<a href="sermons.html">Sermons</a> <br />
<a href="contact.html">Contact Us</a> <br />
<a href="prayer.html">Prayer Requests</a> <br >
<a href="newsletter.html">Newsletter</a> <br />
<a href="http://www.faithmiracle.net/blog1">Pastor Speaks</a>
</div>
<div id="content">
<div id="kim"><img src="kim.jpg" height="150px" class="left" />
<span class="event">Senior Pastor</span>
<br /> Kimberly Britt
<p>I am married to a wonderful husband. Rowdy and I have 5 children who are all graduated and live on their own. I was born and raised in Hannibal/New London.I went down a long path of failures and addictions before realizing I was in need of a Saviour. In 1998 I hit my bottomless pit. I wanted something different, but was not sure what it was or how to get it. It wasn't until I called upon God to save me and ask him to give me the will to live that my life changed. God began to remove all the years of hurt and anger from me. There was one thing I had never realized keeping me in bondage, and that was "UNFORGIVENESS." When the Lord began to deal with my anger and revealing to me that I must forgive others to be forgiven I was sure I would go to Hell because there was no way I could forgive them. God began to change my heart about the way I felt. Not only did I find I could forgive others, I found that I could let go of the anger I had with God. I gave my heart and life to Christ on December 28, 1998 and today I am ever so grateful that when everyone gave up on me Jesus continued to want me. Now I serve God and seek to fulfill his will and command.</p>
</div>
<div id="james"><img src="james.jpg" height="150px" class="right" />
<span class="event">Associate Pastor</span>
<br />James Bridges</div>
<div id="cathy"><img src="cathy.jpg" height="150px" class="left" />
<span class="event">Youth Pastor</span>
<br />Cathy Haden</div>
<div id="rowdy"><img src="rowdy.jpg" height="150px" class="right" />
<span class="event">Elder</span>
<br />Rowdy Britt<p> Hi. I live on the outside of Hannibal, MO with my wife. We have 5 kids. I have been employed with Tri-State Equipment for 29 years. I enjoy restoring Studebakers and Jeep Willy's. I love to share time with my wife and kids when ever we can. My wife and I enjoy antiques and gardening. We spend alot of our time working in the church and trying to fulfill the needs of our church family as well as in our community. </p></div>
<div id="bob"><img src="bob.jpg" height="150" class="left" />
<span class="event">Elder</span>
<br />Bob Haden</div>
<div id="linda"><img src="choir.jpg" height="150px" class="right" />
<span class="event">Choir Director</span>
<br />Linda Malia</div>
</div></div>
</body></html>
Thank you for your time.