background color not extending

MediaSvcsUnlimited · January 29, 2016

Can someone help me figure out why the green background that the word portfolio is in, isn't extending past the portfolio examples on http://mediaservicesunlimited.com/homeTest.php

<?php
require_once('functions.php');
?>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Marketing services for small businesses</title>
<meta name="keywords" content="marketing activities,  social media management, video editing ">
<meta name="description" content="Media Services Unlimited is a marketing agency that focuses on assisting small businesses and nonprofits with their marketing activities.  ">
<link href='https://fonts.googleapis.com/css?family=Satisfy' rel='stylesheet' type='text/css'>
<script type="text/javascript" src="http://www.linkbuildingservices4sites.com/resources/slide-show.js"></script>
<link rel = "stylesheet" href = "MSU.css">
   <!--[if It IE 9]>
    <script src="http://html5shiv.googlecode-.com/svn/trunk/html5.js">
    </script>
    <![endif]-->
<style type="text/css">
.front {
	padding-top:1%;
	width:7%;
	margin-left:auto;
	margin-right:auto;
}
#intro {
	width: 100%;
	background-color:#04AC8F;/*6AA076;#73A57F;*/
	padding-bottom: 2%;
}
h1 {
	color: #FFFFFF;
	font-family: 'satisfy', cursive;
 	font-style: normal;
	font-weight: 400;
	font-size: 2em;
	text-shadow: 0px 0px;
	margin-left: 4%;
	padding-top: 2%;
}
#portfolio {
	width:100%;
	background-color:#295A55;
}
#testimonyHeading {
	color:#2296A7; 
	font-family: 'satisfy', cursive;
	margin-left:5%;
}
#portfolioHeading {
	color:#FFFFFF; 
	font-family:  'satisfy', cursive;
	margin-left:5%; 
	padding-top:2%;
}
article {
	width:80%;
	background-color:#FFFFFF;
	margin-left:auto;
	margin-right:auto;
	padding:2%;	
}
.flip3D {
		width: 30%;
		height:100px;
		float:left;
		margin:10px;
		margin-left:auto;
		margin-right:auto; 
		padding-left:  12%; 
	}
	.flip3D > .front {
		position:absolute;
		transform:perspective(600px)
		rotateY(0deg);
		background-color: #FFFFFF;
		width:30%;
		height:100px;
		border-radius:7px;
		backface-visibility:hidden;
		transition:transform .5s linear 0s;
	}
.flip3D > .back {
		position:absolute;
		transform: perspective(600px)
		rotateY(180deg);
		background-color:#FFFFFF;  
		width:30%;
		height:100px;
		border-radius: 7px;
		backface-visibility: hidden;
		transition: transform .5s linear 0s; 
}
.flip3D:hover > .front {
	transform: perspective(600px) rotateY(-180deg);
}.flip3D:hover > .back {
	transform: perspective(600px) rotateY(0deg);
}
#testimonies {
	height:6em;
	width:40%;
	margin-right:auto;
	margin-left:auto;
	text-align:center;
	padding-left:10%;
	padding-right:10%;
	padding-bottom:2%;
	padding-top:2%; 
	background-color:#cae7eb;
}
li {
	list-style-type:circle; 
}
#portfolio {
	clear:both;

}
#portfolioSamples {
	width:  100%;
	margin-left:auto; 
	margin-right:auto; 
	background-color:  red; /*#295A55;*/
}
.quotes
        {
			display:none; 
		}
footer {
	clear:  both;
	margin-top:50px; 
}
.skills {
	list-style-type:none;
}
</style>

<link href="MSU.css" rel="stylesheet" type="text/css">
<link href="jQueryAssets/jquery.ui.core.min.css" rel="stylesheet" type="text/css">
<link href="jQueryAssets/jquery.ui.theme.min.css" rel="stylesheet" type="text/css">
<link href="jQueryAssets/jquery.ui.button.min.css" rel="stylesheet" type="text/css">
<link href="jQueryAssets/jquery.ui.tabs.min.css" rel="stylesheet" type="text/css">
<!--The following script tag downloads a font from the Adobe Edge Web Fonts server for use within the web page. We recommend that you do not modify it.-->
<script src="jQueryAssets/jquery-1.11.1.min.js" type="text/javascript"></script>
<script src="jQueryAssets/jquery.ui-1.10.4.button.min.js" type="text/javascript"></script>
<script src="jQueryAssets/jquery.ui-1.10.4.tabs.min.js" type="text/javascript"></script>
<script>var __adobewebfontsappname__="dreamweaver"</script><script src="http://use.edgefonts.net/bad-script:n4:default;arbutus:n4:default;allan:n7:default.js" type="text/javascript"></script>
    <script type="text/javascript">
var slideArray = new Array()
slideArray[0]= "Mindy was a great employee.  She was always on-point, task driven, and greatly assisted in our sales efforts.  Our business is very challenging and competitive, but Mindy helped us to overcome obstacles and succeed whenever possible. <br /> Jon Landua EarthCoolor";
slideArray[1]= "We chose Mindy because of her creativity, professionalism and ability to \"beat the clock\". We were pleased with the finished marketing projects she completed on behalf of our fundraiser!\" Wells Community Boys & Girls Club";
slideArray[2]= "Mindy did an outstanding job working with our sales team. Her hard work and intuitive approach were valuable assets in helping us achieve our sales goals.\” Kim Price EarthColor";

function textSlideShow()
{
var total_slides;
total_slides=Math.floor(Math.random()*slideArray.length)
document.getElementById('testimonies').innerHTML=slideArray[total_slides];
setTimeout("textSlideShow()",3000);
}
</script>  
</head>
<body>
<?php logoMenu();?>
<div id="intro">
<h1>Meeting all your marketing needs. . .  </h1>
<article>  
Media Services Unlimited (MSU) was founded by Indiana entrepreneur Mindy Thomas
 to offer a variety of creative services to small business owners and not-for-profit organizations that cannot afford their own in-house marketing staff.  Here are just some of the services offered by our company:<br>
<ul>
	<li>Web design </li>
	<li>Web content management</li>
	<li>Search engine optimization </li>
	<li>Social media management</li>
	<li>Video editing</li>
	<li>Marketing material creation </li>
	<li>Creative writing</li>
</ul>    
Let Media Services Unlimited handle your marketing so you can concentrate on the other important aspects of operating and growing your organization!
<!--Running a business, of any size, is rough, but it's especially rough for small  businesses.  as an owner of a small business, you wear so many hats!  You are the salesperson, the producer of the product, and sometime you have to do all the marketing work.  Wouldn't it be nice if there was a way to hand the marketing tasks to someone else, and not have to hire a full-time marketing staff?  Well, fortunately there is!  Media Services Unlimited is a full-service marketing company specifically geared towards small businesses.  We handle all the marketing tasks, so you can focus on producing high-quality products and your customers!  -->
</article>
</div>
 <h2 id="testimonyHeading">Testimonies </h2>
 <div id="testimonies">
 <script type="text/javascript" language="javascript">textSlideShow();</script></div>
 <div id="portfolioSamples">
  <div id = "portfolio">
<h2 id="portfolioHeading"> Portfolio </h2>
<div class ="flip3D">
	<div class ="front">
		Website Portfolio 
    </div> 
	<div class ="back">
		<ul> 
            	<li class="skills"><a href="assets/Helping_Hands_Website_Screenshots.jpg" target="_blank">Website Design</a></li>
                <li class="skills">Content Management </li>
                <li class="skills">SEO</li>
            </ul>
    </div> <!--end of back class -->
</div><!--end of flip3d-->
<div class ="flip3D">
	<div class ="front">
		Marketing Portfolio 
    </div> 
	<div class ="back">
		<ul>
            	<li class="skills"><a href="assets/murder_mystery_invite.jpg" target="_blank">Marketing Material Creation</a></li>
                <li class="skills" >Social Media Management </li>
                <li class="skills">Creative Writing </li>
                <li class="skills">Video Editing </li>
            </ul>
    </div> <!--End of back class -->   
</div><!--end of portfolio div -->
</div><!--end of portfolioSamples -->   

<?php footer(); ?>
</body>
</html>

surajkumardotin · June 14, 2016

Please remove default padding from body.

Sign In

background color not extending

Recommended Posts

MediaSvcsUnlimited

Link to comment

Share on other sites

surajkumardotin

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information