I recently added an email form to my site. Everything worked find for Safari, chrome and IE 10. After uploading my files onto the server the live site has missing styles. The site should look like http://ift.tt/1LllDoQ but instead it looks like this http://ift.tt/1QLX3vi
<!doctype html>
<html>
<head>
<link href="//cdn-images.mailchimp.com/embedcode/slim-081711.css" rel="stylesheet" type="text/css">
<meta charset="utf-8">
<title>CloudHudl</title>
<link href="Landing_styles.css" rel="stylesheet" type="text/css">
</head>
<body style="margin: 0; padding: 0">
<header>
<div id= "logo"></div>
</header>
<div class="Organge">
<div id= "UltimateGame">
ULTIMATE GAME DEVELOPMENT PLATFORM
</div>
<div id= "CloudHudlis">
CloudHudl is a platform for developers, artist and producers.
</div>
<div id= "ConnectandForm">
Connect and Form Develpment Teams
</div>
<div id= "CreateandDevelop">
Create and Develop Games Through the Web
</div>
<div id="WePublish">
We Publish Your Games!
</div>
</div>
<div id= "StayInformed">
STAY INFORMED
</div>
<div id="About">
We are creating a platform for developers, artist, and producers from all walks of life. Our platform gives people with an idea the ability to connect with talented individuals from
across the globe. Project management, file sharing and collaboration, and development are simple to run on CloudHudl. In addition, our publishing services for games gives producers’
complete creative freedom, so they can create the content they want to create. Our platform allows talented producers and designers to create unhindered projects of any size, from
anywhere in the world and provides the opportunity for any project to succeed, not just exist. If you’re a developer, producer, artist, coder, or just interested in getting involved,
fill out our form below to stay up to date and receive a notification before our launch date.
</div>
<div class= "Grey">
</div>
<div id= "bubble">
</div>
<div id= "sheet">
</div>
<div id= "controller">
</div>
<!-- Sign-up -->
<div id="mc_embed_signup">
<form action="//cloudhudl.us11.list-manage.com/subscribe/post?u=e31b06ffc35cb8b0ebaa0081b&id=79f3fa778c" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
<div id="mc_embed_signup_scroll">
<input type="email" value="" name="EMAIL" class="email" id="mce-EMAIL" placeholder="email address" required>
<!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
<div class="clear"><input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
</div>
</form>
</div>
<!--end signup-->
<footer>
<address>
Copyright 2015 ©
(620) 605-2154;
</address>
</footer>
</body>
</html>
/*
Cloud Hudl
Index stylesheet
Author: Cameron Hall
Date: 9/25/2015
Filename: indexstyles.cc
*/
html, body { height: 100%; }
.Organge {
float: left;
background-color: #fa7862;
width: 100%;
height: 80%;
}
.Grey {
background-color: rgb(242, 242, 242);
width: 100%;
height: 20%;
clear: both;
}
#UltimateGame
{
font-size: 20px;
font-family: "MS Sans Serif";
color: rgb(255, 255, 255);
line-height: 1.2;
text-align: center;
position: absolute;
left: 36%;
top: 22%;
width: 479px;
height: 26px;
z-index: 3;
}
#CloudHudlis
{
font-size: 14px;
font-family: "MS Sans Serif";
color: rgb(255, 255, 255);
line-height: 1.2;
text-align: center;
position: absolute;
left: 38.5%;
top: 26%;
width: 377px;
height: 15px;
z-index: 4;
}
#ConnectandForm
{
font-size: 12px;
font-family: "MS Sans Serif";
color: rgb(255, 255, 255);
line-height: 1.2;
text-align: center;
position: absolute;
left: 16%;
top: 50%;
width: 110px;
height: 26px;
z-index: 5;
}
#CreateandDevelop
{
font-size: 12px;
font-family: "MS Sans Serif";
color: rgb(255, 255, 255);
line-height: 1.2;
text-align: center;
position: absolute;
left: 45%;
top: 50%;
width: 132px;
height: 26px;
z-index: 9;
}
#WePublish
{
font-size: 12px;
font-family: "MS Sans Serif";
color: rgb(255, 255, 255);
line-height: 1.2;
text-align: center;
position: absolute;
left: 76%;
top: 50%;
width: 135px;
height: 9px;
z-index: 6;
}
#StayInformed
{
font-size: 18px;
font-family: "MS Sans Serif";
color: rgb(0, 0, 0);
line-height: 1.2;
text-align: center;
position: absolute;
left: 42.83%;
top: 80%;
width: 197px;
height: 128px;
z-index: 18;
}
#mce-EMAIL
{
font-size: 20px;
font-family: "MS Sans Serif";
color: rgb(153, 153, 153);
line-height: 1.2;
text-align: center;
position: absolute;
width: 80%;
height: 100%;
}
input.button
{
font-size: 18px;
font-family: "MS Sans Serif";
background-color: #fa7862;
color: rgb(255, 255, 255);
line-height: 1.2;
text-align: center;
position: absolute;
top: -1px;
left: 80%;
width: 40%;
height: 120%;
}
[placeholder]:focus::-webkit-input-placeholder {
transition: opacity 0.5s 0.5s ease;
opacity: 0;
}
#mc_embed_signup
{
background-color: rgb(255, 255, 255);
position: absolute;
left: 36%;
top: 85%;
width: 25%;
height: 3.5%;
z-index: 13;
}
#logo
{
background-image: url("logo.png");
position: absolute;
left: 36.5%;
top: 4%;
width: 425px;
height: 100px;
z-index: 7;
}
#bubble
{
background-image: url("bubble.png");
position: absolute;
left: 17.57%;
top: 37.8%;
width: 72px;
height: 65px;
z-index: 8;
}
#sheet
{
background-image: url("sheet.png");
position: absolute;
left: 47%;
top: 37.8%;
width: 56px;
height: 72px;
z-index: 10;
}
#controller
{
background-image: url("controller.png");
position: absolute;
left: 77%;
top: 38.55%;
width: 92px;
height: 59px;
z-index: 11;
}
#About {
font-size: 18px;
font-style:italic;
font-family: "MS Sans Serif";
color: rgb(255, 255, 255);
text-align: center;
position: absolute;
top: 60%;
margin-left: 25%;
margin-right: 25%;
}
footer {
clear: left;
width: 100%;
text-align: center;
}
footer address {
width: 100%;
clear: left;
font-size: 1.2em;
font-style: normal;
font-variant: small-caps;
background-color: rgb(242, 242, 242);
}
Aucun commentaire:
Enregistrer un commentaire