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
Adrian Pandelica
Courses Plus Student 2,106 PointsStyle the Portfolio
I've done everything like in the video but my website doesn't have pics side by side. Can someone help me ? thx
7 Answers
Adrian Pandelica
Courses Plus Student 2,106 Points/****************************** General *******************************/
body { font-family: 'Oswald', sans-serif; }
wrapper {
max-width: 940px; margin: 0 auto; padding: 0 5%; }
a { text-decoration: none; }
img { max-width: 100%; }
/****************************** Heading *******************************/
header { float: left; margin: 0 0 30px 0; padding: 5px 0 0 0 ; width: 100% ; }
logo {
text-align: center; margin: 0; }
h1 { font-family:'Roboto', sans-serif; margin: 15px 0; font-size: 1.75em; font-weight: normal; line-height:0.8em; }
h2 { font-size: 0.75em; margin: -5px 0 0; font-weight: normal }
/****************************** Navigation *******************************/
nav { text-align: center; padding: 10px 0; margin: 20px 0 0; }
nav ul { list-style: none; margin: 0 10px; padding: 0; }
nav li { display: inline-block; }
/****************************** Footer *******************************/
footer{ font-size: 0.75em; text-align:center; padding-top: 50px; color: #ccc; }
/********************************** PAGE: PORTFOLIO ***********************************/
gallery {
margin: 0; padding: 0; list-style: none; }
gallery li {
float: left; width: 45%; margin: 2.5%; background-color: #f5f5f5; color: #bdc3c7; }
/****************************** Colors *******************************/
body { background-color: #fff; color: #999; }
/* green header */
header { background: #6ab47b; border-color: #599a68; }
/* nav bacakground on mobile */
nav { background: #599a68; }
/* logo text */
h1, h2 { color: #fff; }
/* links */
a { color: #6ab47b; }
/* nav link */
nav a, nav a:visited { color: #fff; }
/* selected nav link */
nav a.selected, nav a:hover { color: #32673f; }
Janek Rezner
12,973 Pointsno # signs before elements you're trying to style (invalid selectors) ?
like this:
#gallery {
margin: 0; padding: 0; list-style: none; }
#gallery li {
float: left; width: 45%; margin: 2.5%; background-color: #f5f5f5; color: #bdc3c7; }
Adrian Pandelica
Courses Plus Student 2,106 Points/****************************** General *******************************/
body { font-family: 'Oswald', sans-serif; }
wrapper {
max-width: 940px; margin: 0 auto; padding: 0 5%; }
a { text-decoration: none; }
img { max-width: 100%; }
/****************************** Heading *******************************/
header { float: left; margin: 0 0 30px 0; padding: 5px 0 0 0 ; width: 100% ; }
#logo { text-align: center; margin: 0; }
h1 { font-family:'Roboto', sans-serif; margin: 15px 0; font-size: 1.75em; font-weight: normal; line-height:0.8em; }
h2 { font-size: 0.75em; margin: -5px 0 0; font-weight: normal }
/****************************** Navigation *******************************/
nav { text-align: center; padding: 10px 0; margin: 20px 0 0; }
nav ul { list-style: none; margin: 0 10px; padding: 0; }
nav li { display: inline-block; }
/****************************** Footer *******************************/
footer{ font-size: 0.75em; text-align:center; padding-top: 50px; color: #ccc; }
/********************************** PAGE: PORTFOLIO ***********************************/
gallery { margin: 0; padding: 0; list-style: none; }
gallery li { float: left; width: 45%; margin: 2.5%; background-color: #f5f5f5; color: #bdc3c7; }
/****************************** Colors *******************************/
body { background-color: #fff; color: #999; }
/* green header */
header { background: #6ab47b; border-color: #599a68; }
/* nav bacakground on mobile */
nav { background: #599a68; }
/* logo text */
h1, h2 { color: #fff; }
/* links */
a { color: #6ab47b; }
/* nav link */
nav a, nav a:visited { color: #fff; }
/* selected nav link */
nav a.selected, nav a:hover { color: #32673f; }
Adrian Pandelica
Courses Plus Student 2,106 PointsNo. but still the same . no columns .
Janek Rezner
12,973 Pointsuse Markdown Cheatsheet to wrap your code before you post it here
Adrian Pandelica
Courses Plus Student 2,106 Points/****************************** General *******************************/
body { font-family: 'Oswald', sans-serif; }
wrapper {
max-width: 940px; margin: 0 auto; padding: 0 5%; }
a { text-decoration: none; }
img { max-width: 100%; }
/****************************** Heading *******************************/
header { float: left; margin: 0 0 30px 0; padding: 5px 0 0 0 ; width: 100% ; }
#logo { text-align: center; margin: 0; }
h1 { font-family:'Roboto', sans-serif; margin: 15px 0; font-size: 1.75em; font-weight: normal; line-height:0.8em; }
h2 { font-size: 0.75em; margin: -5px 0 0; font-weight: normal }
/****************************** Navigation *******************************/
nav { text-align: center; padding: 10px 0; margin: 20px 0 0; }
nav ul { list-style: none; margin: 0 10px; padding: 0; }
nav li { display: inline-block; }
/****************************** Footer *******************************/
footer{ font-size: 0.75em; text-align:center; padding-top: 50px; color: #ccc; }
/********************************** PAGE: PORTFOLIO ***********************************/
gallery {
margin: 0; padding: 0; list-style: none; }
gallery li {
float: left; width: 45%; margin: 2.5%; background-color: #f5f5f5; color: #bdc3c7; }
/****************************** Colors *******************************/
body { background-color: #fff; color: #999; }
/* green header */
header { background: #6ab47b; border-color: #599a68; }
/* nav bacakground on mobile */
nav { background: #599a68; }
/* logo text */
h1, h2 { color: #fff; }
/* links */
a { color: #6ab47b; }
/* nav link */
nav a, nav a:visited { color: #fff; }
/* selected nav link */
nav a.selected, nav a:hover { color: #32673f; }
Adrian Pandelica
Courses Plus Student 2,106 PointsI still don't have columns. Can someone have a look ! pls
Janek Rezner
12,973 PointsJanek Rezner
12,973 Pointsyou have to show us your code first!