Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Kyle Biancardi
1,674 Pointswhen i size my window to mobile size, my images don't stay where they should. what am i doing wrong?
here is my code <html>```<html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Kyle Biancardi | Designer</title>
<link rel="stylesheet" href="css/normalize.css">
<link href='http://fonts.googleapis.com/css?family=Holtwood+One+SC|Cinzel+Decorative|NTR' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Poiret+One' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="css/main.css">
</head>
<body>
<header>
<a href="index.html" id="logos">
<h1>Kyle Biancardi</h1>
<h2>Designer</h2>
</a>
<div id="nav">
<nav>
<ul>
<li><a href="index.html"class="selected">Up and Coming</a></li>
<li><a href="about.html">About Us</a></li>
<li><a href="contact.html">Contact KBLax</a></li>
</ul>
</nav>
</div>
</header>
<div id="wrapper">
<section>
<ul id="gallery">
<li>
<a href="img/numbers-01.jpg">
<img src="img/numbers-01.jpg" alt="">
<p>Learning texture and Colors</p>
</a>
</li>
<li>
<a href:"img/numbers-02.jpg">
<img src="img/numbers-02.jpg" alt="">
<p>Playing with Drips</p>
</a>
</li>
<li>
<a href="img/numbers-06.jpg">
<img src="img/numbers-06.jpg" alt="">
<p>Trying 80's Glow!</p>
</a>
</li>
<li>
<a href:"img/numbers-09.jpg">
<img src="img/numbers-09.jpg" alt="">
<p>playing with brush</p>
</a>
</li>
<li>
<a href:"img/numbers-12.jpg">
<img src="img/numbers-12.jpg" alt="">
<p> playing with repitions</p>
</a>
</li>
</ul>
</section>
<footer>
<a href="http://www.facebook.com" alt="facebook logo">
<img src="img/facebook-wrap.png">
</a>
<a href="http://www.twitter.com" alt="twitter logo">
<img src="img/twitter-wrap.png">
</a>
<p>Ā© 2014 Kyle Biancardi</p>
</footer>
</div>
</body>
</html>
/******************************
General Basic Design CSS Page
******************************/
a {
text-decoration: none;
}
img{
max-width: 100%;
}
}
/**************************
Page Content imgs, captions
**************************/
#wrapper{
max-width: 940px;
margin:0 auto;
text-align:center;
padding:0 5%;
font-family: 'ntr',sans-serif;
}
/******************
Headlines
******************/
#logos{
text-align: center;
margin:0;
}
h1 {
font-family: 'cinzel decorative', sans-serif;
margin:5px 0;
font-size:3.75em;
}
h2{
font-family:'cinzel decorative', sans-serif;
margin: -2px 0 0;
font-size: 2.5em
}
header{
background:#990000;
}
h1,h2, h1:visited{
color:#fff;
}
/******************
Navigation
******************/
nav{
font-family:'poiret one',sans-serif;
font-weight:normal;
font-size:1.75em;
}
nav{
text-align: center;
}
nav{
background:#cccccc;
}
nav a, nav a:visited{
color:#fff;
}
nav a.selected{
color:#cc0000;
}
nav a:hover{
color:#cc0000;
}
/******************
Body
******************/
body{
background:#fff;
}
footer{
color:#999;
margin:5px 0 0;
padding-top:-5px;
}
/**************************
Portfoilio Design
**************************/
#Gallery{
margin:0;
padding:0;
}
#gallery li{
list-style:none;
float:left;
width:45%;
margin:2.5%;
background:#f5f5f5;
text-align:center;
}
#gallery li a p{
margin: 0;
padding: 5%;
color: #bdc3c7;
font-size: 0.75em;
}
1 Answer
Dan Oswalt
23,438 PointsOne problem I see is that you're using colons instead of = in your img attributes. Also, where is 'where they are supposed to be'?
Kyle Biancardi
1,674 PointsKyle Biancardi
1,674 Pointswhen i shrink my screen down; instead of the images maintaining their places one image i the second column will skip over to the left leaving me a gap under the fist picture.