<div class =" container-fluid">
<h2 class="red-text">CatPhotoApp</h2>
<p>Click here for <a href="#">cat photos</a>.</p>
<a href="#"><img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat"></a>
<p>Things cats love:</p>
<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
<ol>
<li>flea treatment</li>
<li>thunder</li>
<li>other cats</li>
</ol>
<form action="/submit-cat-photo">
<label><input type="radio" name="indoor-outdoor"> Indoor</label>
<label><input type="radio" name="indoor-outdoor"> Outdoor</label>
<label><input type="checkbox" name="personality"> Loving</label>
<label><input type="checkbox" name="personality"> Lazy</label>
<label><input type="checkbox" name="personality"> Crazy</label>
<input type="text" placeholder="cat photo URL" required>
<button type="submit">Submit</button>
</form>
</div>
<h2 class="red-text">CatPhotoApp</h2>
<p>Click here for <a href="#">cat photos</a>.</p>
<a href="#"><img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat"></a>
<p>Things cats love:</p>
<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
<ol>
<li>flea treatment</li>
<li>thunder</li>
<li>other cats</li>
</ol>
<form action="/submit-cat-photo">
<label><input type="radio" name="indoor-outdoor"> Indoor</label>
<label><input type="radio" name="indoor-outdoor"> Outdoor</label>
<label><input type="checkbox" name="personality"> Loving</label>
<label><input type="checkbox" name="personality"> Lazy</label>
<label><input type="checkbox" name="personality"> Crazy</label>
<input type="text" placeholder="cat photo URL" required>
<button type="submit">Submit</button>
</form>
</div>
dont forget the closing div at the bottom
that caught me out
@clarkarnold remember scope also no need to stringify anything just get it directly on json parameter
var arr;
var url;
var lat;
var lon;
var str;
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position) {
$("#data").html("latitude: " + position.coords.latitude + "<br>longitude: " + position.coords.longitude);
lon = position.coords.longitude;
lat = position.coords.latitude;
url = "http://api.openweathermap.org/data/2.5/weather?lat=" + lat + "&lon=" + lon + "&appid=44db6a862fba0b067b1930da0d769e98&units=imperial";
runFun(); //<---------------as mentioned call this here to insure the lat and lon are set
});
}
function runFun() {
$.getJSON(url, function(json) {
console.log(json);
arr = json; //<-------------no need for this
str = JSON.stringify(json); ///<-----------no need for this
//move here to reach the json/data
$("#test").html("City: " + json.name + "<br>Temp: " + json.main.temp + "<br>Wind: " + json.wind.speed + " MPH from " + json.wind.deg + " degrees" + "<br>Weather Conditions: " + json.weather[0].main);
});
//<---------------couldnt reach the variable from here move it up
};
cant u not see code???
<link href="http://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
<style>
.red-text {
color: red;
}
h2 {
font-family: Lobster, Monospace;
}
p {
font-size: 16px;
font-family: Monospace;
}
.thick-green-border {
border-color: green;
border-width: 10px;
border-style: solid;
border-radius: 50%;
}
.smaller-image {
width: 100px;
}
</style>
<h2 class="red-text">CatPhotoApp</h2>
<p>Click here for <a href="#">cat photos</a>.</p>
<a href="#"><img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat"></a>
<p>Things cats love:</p>
<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
<ol>
<li>flea treatment</li>
<li>thunder</li>
<li>other cats</li>
</ol>
<form action="/submit-cat-photo">
<label><input type="radio" name="indoor-outdoor"> Indoor</label>
<label><input type="radio" name="indoor-outdoor"> Outdoor</label>
<label><input type="checkbox" name="personality"> Loving</label>
<label><input type="checkbox" name="personality"> Lazy</label>
<label><input type="checkbox" name="personality"> Crazy</label>
<input type="text" placeholder="cat photo URL" required>
<button type="submit">Submit</button>
</form>help level 74 or Use Responsive Design with Bootstrap Fluid Containers
:warning: clarkarnold already gave wearenotgroot points
@mjqblade re-read instruction
@mjqblade where is the <link> for bootstrap!!!!!
@mjqblade from instruction:
You can add Bootstrap to any app just by including it by adding the following code to the top of your HTML:
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css"/>
@mjqblade add that on the top of the page
:warning: clarkarnold already gave wearenotgroot points
:star: 1419 | @h4r1m4u | http://www.freecodecamp.com/h4r1m4u
:star: 2500 | @saintpeter | http://www.freecodecamp.com/saintpeter
I am trying to find a way to get a picture of my own ziplines. Do you have any idea how to do that?
or even dropbox if you mak eit public
:star: 1133 | @mutantspore | http://www.freecodecamp.com/mutantspore
Only with recent versions tho
How's it going @mutantspore
hello frontendies! I finally did make a 3D simon game with pure-css pouring a lot of effort in it! please check it out, you can switch between 2d and 3d graphics. Zoom in to see the height :D http://codepen.io/batilc/pen/rxbadv
Can someone tell me why I can't vertically align all the content in my body in this project? I know my css is probably messy, still learning
http://codepen.io/Fuzyon/pen/KVJBLW
http://codepen.io/Fuzyon/pen/KVJBLW