Reports


Initial Project Proposal


Background

I am proposing to create a fully functional online sports suppliments store.
There are a couple of reasons for choosing this project. For a few years now I have considered the idea of creating an online store. It was something I felt I would be interested in on a part time basis, as a hobby, or with the right project on a full time basis in terms of a business. The fact is I am now studying many of the elements necessary to allow me to actaully build and maintain the running of an effective online store. For that reason it feels like a perfectly timed opportunity to put what Ive learned in to practice and create a viable working prototype of an interactive online store/site.

The reason I have decided to go down the sports suppliment route is because I previously worked for my friend in his sports suppliment business in Limerick. I would have some knowledge of the sports suppliment industry and would use suppliments on occassion. If I were to actually consider creating an online store in the future sports suppliments would be an area I would research further as a viable online business option.

The final reason for taking on this particular project has to do with the expertise that will be available while I carry out this project. It makes sense for me to proceed with creating an online store now while I have project co-ordinators that I can turn to for guidance as opposed to taking on a project like this myself after the course is finished.

In terms of what this project can achieve I believe I can create an interactive website that has all of the funtionality required to be a fully operational webshop site.  

To achieve this I will need to combine all of the elements covered in the Hdip course to date. The structure and layout of the site will be built using web development tools learned such as html5 and css. The functionality of the site will require programming input such as javascript, jquery and php. The online content such as images, navigation bars, logos for the site will be created in photoshop, illustrator and 3ds max. Digital video content will be done in premier pro. The site will require the construction of a database which I intend to create in sql.


Aims of the Project

The aim for the project is to create an interactive website that has the funtionality necessary to operate as a viable, realistic online webstore.

The project will benefit the end users in different ways. From my perspective the benefit would be having a fully functional webstore prototype available that could potentially be used as a webstore/site for an actual online business.

If the site were to be used as a webstore perspective customers would enjoy the benefits associated with being able to purchase products they want online. For the basis of this project those products would be sports suppliments and accessories. Benefits of shopping online generally include favourable pricing compared to highstreet shops, ease of shopping,  home delivery of goods etc.

As the intention is to include an online forum on the site perspective users could benefit from being able to share views, ask questions and discuss topics with people who share similar interests.

I believe the success of the project will be measured in a couple of ways. Firstly it will be important to ensure that the needs of potential users have been met i.e is it clear what the sites purpose is, is the site easy to navigate around, does all of the functionality that is intended work properly.

Secondly I think the projects success will depend how realistically viable it would be to use the site as a functioning webstore. The closer the site is to having the capability to run as a fully functional successful webstore the greater the level of success that can be derived.

Methodology

In terms of research the first thing I need to determine is what the exact funtionality of the site will be and how I am going to achieve that functionality successfully. The project can be broken down into different areas;

Site content – this will be determined by using my own knowledge on the area of sports suppliments, speaking to others who are experienced in the area of sports supliments, speaking to people with experience in online selling, carrying out market research and researching potenital competitor sites.

Site construction – the actual structure of the site is predominently going to be done using html5 and css. How the look of the site is physically structured will depend on the results of research, looking at effective site layouts, researching methods for online selling,  further researching of competitor sites. I will be using online resources such as lynda.com to assist in getting through any structural / layout issues as well as taking advice from the project co-ordinators available to us.

Site funtionality – Most of the sites functionality will be determined by the programming involved. The site will require elements of javascript, jquery and php. I will need to evaluate what programming language will be needed and where it will go, how I will go about encorporating functions from each language that may be beyond my programming experience to date. These issues can be resolved by using the online resources availale such as www.w3schools.com, researching the code from competitors sites etc. There are many other online resources such as jqueryui.com that provides ready made funtionality for websites such as datepickers etc. This will also be an area where the project-cordinators guidance will be vital.

Site appearance – The appearance and style of the site will be created in photoshop and illustrator.
This will entail creating all of the elements of the site from background images to the navigation bar, headers, footers etc. Once the photoshop protoype is created to a high standard the different components can be saved down for the web. The files will be put in place on the site at the appropriate time.

Database – There will be a need for a database in the backend of the site. Depending on the database spcifications I will use Microsoft access or more likely Sql. Before finalising my database requirements I will need to investigate further who will be using the database, what tasks will be performed, how will the data be modified, what hardware i will be using, how will i maintain the data etc. As this will be my first online project incorporating a database I will need to expand my knowledge of database management and how the database will interact with the other elements of the site.

When the webiste is created it will need to undergo numerous rounds of testing. This testing can be broken up into a number of steps;


Functionality Testing
Checking that the sites sepcifications are as intended. Testing activities include testing every link to ensure they are working correctly, testing forms, testing cookies, checking for syntax errors in html and css, testing the business flow e.g ensuring you can go through all the stages of picking a product right through to purchasing it.

Usability Testing
This step requires somebody with no knowledge of the site to test the navigation, check that the content is legible and that there is no grammatical errors.

Database Testing
The database will need to be tested to ensure there are no errors from this perspective.

Operating System / Browser Compatitabiltiy Testing
The site will have to be tested to ensure that the same results are outputted on different operating systems and in different browsers.

Security Testing
The security of the site will need to be tested to ensure the protection of sensitive information such as credit card details.

Crowd Testing
At this point I will get a number of people to use the site and test the site for any unoticed defects.

Expected Outcomes and Deliverables

The expected outcome from this project is the creation of a website that could be used as a viable functioning online store. I would expect to have each element of the site operational and the intention would be that the site would be at the point where it would be hypothetically ready to go live.

The final deliverables will include a functional online store, the final written report and a blog outlining the work that has been completed over the course of the project.

Schedule

Project Gantt Chart






Research Report


Research Report
Interactive Fitness training website


Background – Basic aim

The basic aim of this project is to create a website that teaches beginners how to set up a fitness training program. The training program will consist of 3 different weight programs for the user to choose from. The weights program the user chooses will be in line with their goals. There will also be a cardiovascular program and a section outlining how to go about maintaining a well-balanced diet.

To achieve the first part of my goal above, training with weights, I am going to need to demonstrate to the users a) the core muscle groups of the body and b) the correct exercises and methods that are used to train these muscle groups. I plan to achieve this by demonstrating the body’s muscle groups using a body model and linking the muscle groups to short videos that demonstrate different exercises for each muscle group.   

The fitness and nutritional aspects will be achieved by demonstrating what a successful fitness and nutritional regime looks like and how to go about maintaining it.

The target audience will be people who are new to training or those who are not sure where and how to start. 

I intend to partake in the training program for the duration of the project. I will document my progress, experiences and results in a training blog on a regular basis. The sites users would hypothetically have the opportunity participate in my training program with me, document, compare their results or experiences on my site.

The website will be broken down into different sections;

·       Home Page (Gallery of each page of the site. BMI calculator and explanation )
·       Second Page (Muscle Groups : Human body Model : Link to Exercise Videos)
·       Third Page : Training Programs : Weights 3 program types
·       Fourth Page : Fitness Program
·       Fifth Page: Nutritional information and program. Daily Recommended allowance etc.
·       Sixth Page : Interactive nutritional trivia games / fun facts
·       Seventh Page : Training Blog + Area where users can upload their details, progress to compare with others
·       Project Blog

If time were to allow I would like to develop a simple app. The purpose of the app would be so that users can open their training program on their smartphone as they workout. They could use the app to read their program and secondly they would have the ability to record their training results as they train. For example - Desired results: Dumbbell press 30kg x 6 reps, actual results 30kg x 4 reps.

After discussing the idea of creating an app with the project co-ordinators it looks like there won’t be sufficient time. Therefore I would like to possibly create a mobile version of my website so that it can be used on a smartphone while training.


Motivation for the project

There are a number of reasons why I am interested in an interactive training project. Firstly health, fitness and training have become an integral part of my daily lifestyle. On a number of mornings a week I get up at 6 or 7am and head to the gym before college to do a weights session. Alternatively whenever I can find time after college or on the weekend I jog. On a daily basis I try to ensure that I eat as healthily as possible. So health, fitness and the training that goes along with both are a big part of my life.

Secondly it can often take people years to develop proper training techniques or to follow a structured routine. This project gives me the opportunity to help people to get started on the road towards a fitter and healthier lifestyle.


Project Benefits

There are a number of benefits to a project like this. The end user of this website would stand to benefit in the following ways;

·       They learn how to implement an effective weights program that can be tailored to match their goals. The finished site will identify the core muscle groups in the body and demonstrate to the user through the use of video how to work these muscle groups in a correct and effective manner.
·       The user will learn how to adopt an effective fitness regime into their daily lifestyle.
·       The project will contain a healthy eating plan that when combined with a fitness regime can have a positive effect on the users overall general health.
·       The user will benefit from nutritional tips and healthy recipes.
·       The BMI test can provide the user with an insight into their current physical condition.
·       The blog section would allow users to upload their goals, compare and contrast their results / findings with other site users. They would also be able to follow my progress over the course of the training program.
·       With a mobile website users would be able to access their program through their smartphone in the gym or while they are on the move.
·       I will benefit from this project because I get to put a lot of the aspects I have learned from this course into practice. I will also get to learn new technologies.


Market Research

The first stage of my market research was to compile a short survey in survey monkey and send it out to about 20 potential users of my site. The aim of the survey was to find out if people would use an online training website and what elements they would like to see within such a site. The feedback I received has helped me to understand some of the elements that potential users would need and expect for the site to be a success.

The link to the survey is as follows;

http://www.surveymonkey.com/s/6TXN7Z6

Following the survey I moved on to the second part of my research. This was based around looking at other health and fitness sites, looking at competitor websites, speaking to people who are experienced in the health industry while also speaking to people who would have no real knowledge about what it is to maintain a healthy lifestyle. I also looked at websites to establish an idea of how I would like my site to look.

Some of the websites I have visited are;



I have also researched a number of training programs that could help in the development of a weights, fitness and nutritional training program. Some of the programs I looked at were as follows;

Max OT
Body For Life
Mass Building Guide
Armed and Dangerous
Hypertrophy Options
Mass Builder
Tri Phase Training


Competitors

There are many competitors when it comes to designing a health, fitness, nutritional website.

From the research I’ve carried out websites like passion4profession would be the main competitors in this area. Passion4profession provide online videos of fitness related workouts. They have a health section along with a vast community of online users. Not only do passion4profession provide content from a web perspective but they also offer users the option to download their free app and follow their exercises using a smartphone or tablet. 

Other sites like operation transformation, the biggest loser, youtube, trxtraining are just a few of the hundreds of websites out there that provide some sort of competition in the way of health, fitness or nutrition training. There are also a very large number of personal blogs that deal with health and fitness related areas.


passion4profession.net



Aims and Objectives

The main aim of this project is to offer users the opportunity to make positive changes to their lifestyle by providing them with the information and expertise necessary to do so.

The objective is to create an interactive website that has all of the content necessary in one place to allow a user who may not be familiar with weights, fitness or nutrition, to learn enough information necessary to maintain a healthy training, fitness and nutritional plan. I believe our aims can be met by including the following categories in the site;



·       Muscle Groups (in the form of a human diagram/model) linked to video examples of weight exercises.






  • Exercises for each muscle group , correct form

·       Creating Training Programs incorporating : Weights, Fitness, Nutrition








·       Using instruments available that can help evaluate progress : Body Mass Index Calculator







·       Providing nutritional information, recipes. Using interactive nutritional trivia games.








·       Training Blog – Allow the user to interact with other users of similar interests.

















Achieving aims and objectives

To achieve my aims and objectives I will need to go back and analyse the results of my market research further. This will give me a clearer indication of what I need and what I don’t need in the website to achieve my goals and to give the user a worthwhile user experience.

Once the make-up of my content is finalised I will have to decide on how my site will be constructed, what the navigation will look like and any problems I envisage.

I will have to look at how I am going to create my content. If I am to create a model of the human body to demonstrate the bodies muscle structure I will need to decide if it’s plausible to create the content in 3ds max.

I will need to decide the level of programming that will be needed and how I can go about implementing an interactive trivia game within the site.

I have to decide if it is feasible to create a simple app in flash or whether a mobile site would be more effective.

As I intend to carry out a training blog I would need to start my training program straight away and start blogging about my experiences and findings.  

Programs to be used;

Html
Javascript
Php
Css
3ds Max
Adobe Illustrator, Photoshop, Flash, Premier Pro
Blogger

Deliverables:

There will be a number of core deliverables from the completion of this project.

The first will be an interactive website. The website will contain the relevant information to enable the user to successfully engage in a training program. The training program will incorporate a weights, fitness and nutritional regime as well as provide nutritional advice.

The second will be the creation of an online blog within the site that allows users the ability follow my training program, engage with me or engage with other users of similar interests.

The final deliverable will potentially be the creation of a mobile limited version of the site that can be used on a smartphone or tablet format.


Testing

When the website is created it will need to undergo numerous rounds of testing. This testing can be broken up into a number of steps;


·       Functionality Testing
          Checking that the sites specifications are as intended. Testing activities include testing every link to ensure they are working correctly, checking for syntax errors in html and css.

·       Usability Testing
          This step requires somebody with no knowledge of the site to test the navigation, check that the content is legible and that there is no grammatical errors.

·       Operating System / Browser Compatibility Testing 
The site will have to be tested to ensure that the same results are outputted on different operating systems and in different browsers.

·       Security Testing
The security of the site will need to be tested to ensure the protection of sensitive information such as credit card details.

·       Crowd Testing


At this point I will get a number of people to use the site and test the site for any unnoticed defects. Testers will also go through the process of using the site to ensure it functions for the purpose it as created.


Project Requirements

For the project to be deemed useful it must meet the following requirements;

Design a website that does the following;

·       Enables users to implement and maintain a weight training program.
·       Teaches users the correct form for weight training exercises demonstrated.
·       Enables users to implement and maintain a fitness program.
·       Enables users to implement a healthy eating plan.
·       Allows users to interact with other users on the site.

Other results required;

·       Maintain an on-going blog documenting training results so hypothetically users could interact.


Early Design On Paper






Final Report



Table of Contents

v Abstract

v Introduction

v Design

v Implementation and Testing

v Conclusion / Future Work

v Appendices



















Abstract

Motivation

When I was 12 my father collapsed and subsequently died of a massive heart attack at the age of 53. It wasn’t his first, that came 10 years earlier at the age of 43 and he suffered periods of ill health for the next 10 years up until the time of his death.  He lived in an era where a lot of people didn’t look after their health as well as they should. It was only when I reached my mid-twenties that I started to take my health and lifestyle more seriously, not necessarily because my love of sport but I had seen first-hand the devastating effect not looking after your own lifestyle can have. What I am aiming to achieve with this project is to create a website that has all the elements necessary, under one website, to allow a user to kick start a healthy lifestyle.

Methods

The first thing I did in terms of research for the site was create a survey in survey monkey. The purpose of the survey was to get the opinions of people who already lead active lifestyles and also the opinions of those who don’t. I wanted to understand what the perspective audience felt should be in the site and what would draw them to it. Along with that I checked out various websites such as mensfitness.co.uk, passion4profession.net. I looked at magazines such as Men’s Health and watched television programs like Operation Transformation. I spoke to people in the fitness Industry and those who train regularly.

Findings

The results I found reinforced my theory that there is a niche in the market for a website that can offer fitness, gym and nutritional advice all in the one place. My findings suggest that although there are many outlets on the internet for fitness, gym work and lifestyle there are very few places that offer the user a complete means to transform their lifestyle all in the one place. The vision would be to develop a site where user could learn how to kick-start a healthier lifestyle. I would hope that the site could grow a community of followers who could take something away from the site but and also give something back to the users via the site blog or at a future date to its forum.

Conclusion

10,000 people die from heart disease in Ireland each year. The number of road deaths and suicides although very high only account for a fraction of the people who die compared to heart attacks. Many of those heart attacks are caused by poor lifestyle choices.  I believe a website like Motion Fitness not only can teach users how to adopt a healthy lifestyle but in the long term can also assist in adding years to a user’s life.


Introduction

Motivation

There are a number of reasons as to why I chose to create a health and fitness website. Firstly I have always been a sports fanatic. From an early age I generally loved most things related to sport.  It initially would have started as a child playing tennis, football, rugby, badminton out the back garden with my family. From there it would have progressed to kicking a football in the side street or playing rounder’s in the park. In school I took part in anything from athletics to gaa. As an adult I jog, go to the gym and generally try to keep as active as possible. So doing a project about health and fitness was naturally appealing.

The second reason I was motivated to do a project about health and fitness was to attempt to improve on what is currently offered on the internet in the way of sport, health and fitness, especially in terms of someone looking to kick-start a healthy lifestyle. There are many sites that offer gym advice or fitness advice or give you regular health updates but there seems to be few that offer all of the above under one website.

The final motivation is of personal significance, my father’s death from heart disease aged 53 in 1992.  I have greatly improved my lifestyle in recent years and I believe that is a consequence of seeing my father die so young from what ultimately were many years of poor lifestyle choices. So I would like my website to be able to offer someone that small bit of knowledge to help them to start making improved lifestyle choices and work towards getting fit.

Market for Motion Fitness

There would be potentially a diverse market for Motion Fitness to target. Initially you would have active users who already have an interest in health, fitness and who would most likely be familiar with healthy eating or how to go about starting a fitness regime. There would be a wide range of programs to cater for users already embarking on a healthy lifestyle.

The idea would also be to attract users who have no idea at all about how they should go about changing their lifestyle or to make their lives more active. These users can check their body mass index to get a general indication as to whether they are considered underweight, normal, overweight or obese in relation to their height. The site would allow these users to see the different foods they need to be eating along with the quantities and frequencies for an optimal diet. The users would be able to choose a gym program. They could then go to the video section of the site to see how the different exercises are performed. The blog section would allow these users to follow my workouts. It would also allow them to interact with me and other site users.

43% of Ireland’s adult population played a sport at least once last year. When you consider in 2011 over 3 million of the population in Ireland was aged between 15 and 64 there is a very large demographic who could potentially be interested in a site such as Motion Fitness.















































Design
Interface

I initially intended to go with a standard interface design style consisting of a header and a horizontal navigation bar. The main body was going to be the large portion of content between the navigation bar and the footer. I did not intend to have any side navigation. My initial nonlinear navigation design on paper looked like this:


My first home page Photoshop prototype was as follows:


The initial thinking behind it was to keep the design simple. The front page was intended to contain a picture of an athlete. I also intended to have a BMI calculator on the home page. The initial colour scheme intended was a sleek blue and with a yellow stripe under the navigation bar. This colour scheme never worked but it did it make me realise that to have any success competing with rival sites my colorscheme and interface design would need to radically change.

The design element was one thing that let competitor sites down. Passion4profession.net has a huge source of content for its online communities use. Initially it would be difficult to compete on content with a site like that. However they have a bland uninspiring interface design which is an area I would look to exploit in terms of attracting users.

I researched sites like pinterest and adobe kuler when looking at colour schemes and interface designs. The following are some of the colorschemes I tested.















In the end I decided upon a colourful but clean interface design. I used an alternative style of design for the homepage with unorthodox navigation. The homepage is made up of 11 boxes, each box representing a different page in the site. This is an example of just the layout and colorscheme options tested. I wanted to keep the font as slender and sleek looking as possible. To achieve this effect I used font type century gothic regular.

From a design perspective I used Photoshop, Illustrator, and CSS.







Technical

From a technical perspective I used JavaScript, Php, Sql, HTML5, and CSS.

A database was necessary for the site. To achieve this I created a database in Sql. I used php to link to the database.

JavaScript was used for the running clock and the date in box 11 on the home page.  The Bmi calculator is also created using JavaScript code. The registration form is validated using jquery.

HTML was the mark-up language used. The site was styled using CSS.














Implementation and Testing

The project was implemented in stages. The initial stage consisted of setting up a blog to be maintained throughout the course of the project. The next stage was carrying out a full project proposal. At this point we handed up a fully specified project proposal and project plan. My project proposal changed after the proposal stage. However the initial proposal can be someway incorporated to the project further down the road.

The next stage of the project was carrying out the background research for the project. My first action at this point was to create a survey and deliver it to perspective users of my website. This yielded the most successful results from all the market research undertaken. Patterns of information started to unfold from the survey results and it helped define what information needed to be in the site. Other forms of research at this point included checking out market competitors such as fitness.com, menshealth.com, passion4profession.net. At this point I also started to think about how I wanted our site to look. This led on to designing the navigation for the site on paper. It was here where I had an early indication of what the project might look like. I designed a prototype of the home page in Photoshop. The prototype was very different than how my site ended up looking in the end. However designing the prototype in Photoshop allowed me to realise that the look I had initially earmarked for my site didn’t really work. I started looking at other sites for more design ideas.

Once I had decided on the look and the navigation for my site the build phase began. Initially I decided to build a responsive layout but time constraints meant I had to revert back to a static site. The build consisted of first designing the framework of the home page. Incorporated in that was JavaScript, php, html, css. Once the framework for the home page was completed I moved on through the site. The second page I built was the registration page. This involved using jquery for validation purposes, php, JavaScript, html and css.

Other features involved in the building of the site included incorporating YouTube videos into the side and incorporating a word press blog.

Testing

The testing phase firstly involved me going through the site, checking links, checking validation. I checked that all passwords worked and that the site was functional.

Once I was satisfied with how the site was performing I recruited another member of the class, Roisin, to navigate through the site blindly. She came with a number of small faults that had been missed. 



Discussion, Conclusions and Future Work


There are a number discussions and conclusions that can be drawn from the implementation of this project.

A project like this continually evolves and changes even after the proposal has been submitted.

I found with this project that certain planned design or technical aspects didn’t materialise as expected and its only when you create a prototype that you can tell if something is going to work or not.

In relation to this project I have found it hard not to over design at times. My aim at all times was to keep the design simple but simple design is often harder to achieve than it may look or appear.

In relation to the subject matter market research is key.  The survey I carried out and the results I received back probably had the biggest effect on where I went with this project, in terms of what content went in to it. The answers developed a pattern that was hard to ignore.


Future for this project

There is certainly scope to develop this project out further. In terms of content there is much more that can be added. For example;

  • Increased video content
  • Multiple gym programs, Beginner, Intermediate, Advanced
  • New fitness programs
  • A healthy recipe section
  • A forum so users can interact further and not just on the blog
  • An online shop










Appendices

Kuler Adobe Colour Schemes Tested





















Motion Fitness Social Media













Code Samples

Javascript Clock

<script>
          function startTime()
{
          var today=new Date()
          var h=today.getHours();
          var m=today.getMinutes();
          var s=today.getSeconds();
          // add a zero in front of numbers<10
          m=checkTime(m);
          s=checkTime(s);
          document.getElementById('txt').innerHTML=h+":"+m+":"+s;
          t=setTimeout(function(){startTime()},500);
}

          function checkTime(i)
{
          if (i<10)
           {
          i="0" + i;
          }
          return i;
}
</script>


BMI Calculator

<script>

function calculateBmi() {
var weight = document.bmiForm.weight.value
var height = document.bmiForm.height.value
if(weight > 0 && height > 0){    
var finalBmi = weight/(height/100*height/100)
document.bmiForm.bmi.value = finalBmi
if(finalBmi < 18.5){
document.bmiForm.meaning.value = "You are underweight"
}
if(finalBmi > 18.5 && finalBmi < 25){
document.bmiForm.meaning.value = "You are a healthy weight"
}
if(finalBmi > 25){
document.bmiForm.meaning.value = "You are considered overweight"
}
if(finalBmi > 30){
document.bmiForm.meaning.value = "You are considered obese"
}
}
else{
alert("Please Fill in everything correctly")
}
}

</script>

PHP Registration Input Code

<?php
// Create connection

$con=mysqli_connect("MMSERVER","CMPK00143634","K00143634","CMPK00143634");

// Check connection
if (mysqli_connect_errno($con))
  {
  echo "Failed to connect to MySQL: " . mysqli_connect_error();
  }
 $query = "INSERT INTO register (firstname,surname,address1,address2,county,country,zipcode,phonenumber,email,password)
VALUES ('$_GET[firstname]', '$_GET[surname]','$_GET[address1]','$_GET[address2]','$_GET[county]','$_GET[country]','$_GET[zipcode]','$_GET[phonenumber]','$_GET[email]','$_GET[password]')";

 echo $query;
 if (!mysqli_query($con,$query))
  {
  die('Error: ' . mysqli_error());
  }
echo $query;
mysqli_close($con);

Embedded Video Code

<div id="videos6">
<iframe width="260" height="215" src="http://www.youtube.com/embed/2yjwXTZQDDI" frameborder="0" allowfullscreen></iframe>
</div>


HTML

<div id="foodtable">

<table border="1" cellspacing="5">
<tr>
<th>Proteins</th>
<th>Carbohydrates</th>
<th>Vegetables</th>
</tr>
<tr>
<td>Chicken Breast</td>
<td>Baked Potato</td>
<td>Brocolli</td>
</tr>
<tr>
<td>Turkey Breast</td>
<td>Sweet Potato</td>
<td>Asparagus</td>
</tr>
<tr>
<td>Lean Ground Turkey</td>
<td>Yam</td>
<td>Lettuce</td>
</tr>


HTML & Corresponding CSS

                    #box1
{
         
          width: 330px;
          height: 195px;
          position : absolute;
          margin-left: 335px;
          margin-top: 0px;
          padding: 0px;
          border: 1px solid grey;
          background-color:#052041;
          background-repeat: no-repeat;
          border-radius:10px;
          opacity:1;
}

CSS

<div id="box1">

          <div id="logo"><img src="img/motionfit2.png" alt='image'/>
                    <div style="max-width:50px">
          </div></div></div>














No comments:

Post a Comment