1 Replies - 529 Views - Last Post: 31 October 2009 - 10:06 PM

#1 rfairchild  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 23
  • Joined: 24-October 09

css help

Posted 31 October 2009 - 09:13 PM

these was the directions for the project: redesign the website for a no profit organization using two different css to prodcue two dramitically different looking pages with the same content. include in both webpages at least one css element for each of the following:font, positon,background, borders, and margins.

My css codes are a mess, i didn't know about creating style sheets before attempting this. But my layouts turn out to be identical to each other instead of two different designs. so any ideas on how i can enhance my pages.

css code for pg1:
<head>
<title>Making a Difference for Children</title>
</head>

<body>

<p>
<hr style= "color : black; background-color: black; height: 2; width: 100%" />

<h2>Overview</h2>
<p>The Make-A-Wish Foundation® of the Mid-Atlantic, Inc. is a nonprofit organization that fulfills the wishes of children with life-threatening medical conditions to enrich the human experience with hope, strength and joy. The Foundation serves children who reside in Maryland, the District of Columbia, Northern Virginia (Arlington, Fairfax, Fauquier, Loudoun and Prince William Counties as well as city of Alexandria) and Delaware.</p>

<h2> Objectives </h2>
<ul style="list-style-type: square">
<li> Enriched the lives of children with life-threatening medical conditions </li>
<li>The Foundation's mission reflects the life-changing impact that a Make-A-Wish® experience has on children, families, referral sources, donors, sponsors and entire communities
<li>Volunteers serve as wish granters, fundraisers, special events assistants and in numerous other capacities.</li>
<li> An estimation of 25,000 volunteers make a difference every day</li>
</ul>

<h2>Background</h2>
<p>The Make-A-Wish Foundation was founded in 1980 after a little boy named Chris Greicius realized his heartfelt wish to become a police officer. Since its humble beginnings, the organization has blossomed into a worldwide phenomenon, reaching more than 174,000 children around the world. Although it has become one of the world's most well-known charities, the Make-A-Wish Foundation has maintained the grassroots fulfillment of its mission. </p>


<p><a href = "http://www.wish.org">Main Site</a></p>

</body>
</html>







code for page2:
<html>
<head>
<title>More Information</title>

<style type="text/css">
<body {background-color: blue}
h2 {background-color:pink}
p.margin{
margin-top:100px;
margin-bottom:100px;
margin-right:50px;
margin-left:50px;}

h2 {font-size:40px}
p {font-size;14px}
h2 {border:5px solid blue}
h2.pos_left
{position:relative;left:-20px;}
h2.pos_right
{position:relative;left:20px;}

p.margin{margin-top:70px;margin-bottom:100px;margin-right:50px;margin-left:50px;}

</style>
</head>
<head>
<title>More Information</title>
</head>

<body>

<table border = "1" width = "40%"
summary = "This table provides information about
contacting the Make a Wish Foundation">
<hr style= "color : black; background-color: black; height: 2; width: 100%" />


<p>Do you have an question about the organization? See the table below for contact information.</p>

<h4>Contact Information:</h4>
<table border="1">
<tr>
<th>Locations Served</th>
<th>Address</th>
<th>Web Site</th>
<th>Phone Number</th>
<th>Fax Number</th>
</tr>
<tr>
<td>All of Maryland, Delaware, D.C. and Northern Virginia</td>
<td>5272 River Road
Suite 700
Bethesda, MD 20816</td>
<td>midatlantic.wish.org </td>
<td>(301)962-9474</td>
<td>(301)962-6900</td>
</tr>
</table>


<h2> Volunteer Opportunites </h2>
<ul style="list-style-type: square">
<li> Committee Members-Board members guide chapters in delivering missions.</li>
<li>Event/Fundraiser Planning & Assistance-Fundraising events help the foundationn raise the money to grant wishes. Volunteer to help us plan and execute these important events. </li>
<li>Language Interpreters Translators-Translates information for families who does not speak English. </li>
<li> Office Help-Keeps everything running smoothly within the office. </li>
<li>Professional Help-Where you can demontrate a special talent such as building a treehouse. </li>
<li>Public Speaking/Advocacy & Promotion-Gives Speeches and particpates in community events. </li>
<li>Wish Granters -Requires training and Orientations, This area requires a serious time committment.</li>
</ul>


<p>Click on any Point of Interest</p>
<form name="input" action="html_form_action.asp" method="get">
Committee Members:
<input type="checkbox" name="vehicle" value="Committee Members" checked="checked" />
<br />
Event/Fundraiser Planning & Assistance:
<input type="checkbox" name="vehicle" value="Event/Fundraiser Planning & Assistance" />
<br />
Language Interpreters Translators:
<input type="checkbox" name="vehicle" value="Language Interpreters Translators" />
<br />
Office Help-:
<input type="checkbox" name="vehicle" value="Office Help" checked="checked" />
<br />
Professional Help:
<input type="checkbox" name="vehicle" value="Professional Help" />
<br />
Public Speaking/Advocacy & Promotion:
<input type="checkbox" name="vehicle" value="Public Speaking/Advocacy & Promotion" />
<br />
Wish Granters:
<input type="checkbox" name="vehicle" value="Wish Granters" />
<br />
</form>

</body>
</html>

Is This A Good Question/Topic? 0
  • +

Replies To: css help

#2 jwwicks  Icon User is offline

  • D.I.C Head
  • member icon

Reputation: 24
  • View blog
  • Posts: 162
  • Joined: 31-July 08

Re: css help

Posted 31 October 2009 - 10:06 PM

Hello,

View Postrfairchild, on 31 Oct, 2009 - 08:13 PM, said:

these was the directions for the project: redesign the website for a no profit organization using two different css to prodcue two dramitically different looking pages with the same content. include in both webpages at least one css element for each of the following:font, positon,background, borders, and margins.

My css codes are a mess, i didn't know about creating style sheets before attempting this. But my layouts turn out to be identical to each other instead of two different designs. so any ideas on how i can enhance my pages.


For inspiration try CSS Zen Garden. The exact same HTML is used for all the designs.

Jw
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1