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![](https://ecs-static.teamtreehouse.com/assets/views/marketing/shared/community-banner-white-47072046c51352fe6a69f5e691ff5700b28bb11d45197d7bdf066d9ea3f72d0c.webp)
![martin wong](https://uploads.teamtreehouse.com/production/profile-photos/8595042/micro_df9289a1-ecfc-4861-9490-2946e20238af_1_.jpg)
martin wong
4,799 PointsCSS is messed up and i dont know what i done wrong
So at first i tried altering my NAV bar like in video but it kept overlapping my h1 and and when i hovered over the options, it kept like 'flashing' and taking up the width of the space. So ive been playing around to try get it right but now ive totally messed up my code and my images are coming up huge. I dont know what to do and am getting frustrated. help please!
my main problem now is my logo/header wont show my p1.
/****************************
General
*****************************/
body {
color:#988;
background:white;
font-family: 'oswald', monospace;
}
#wrapper {
margin:0 auto;
padding:5px;
max-width:940px;
}
img {
max-width:100%;
}
footer {
clear:both;
text-align:right;
}
a {
text-decoration:none;
}
/****************************
LOGO/HEADING
****************************/
header {
float: left;
margin:0 0 30px 0;
padding: 5px 0 0 0;
width:100%;
}
#logo {
text-decoration:none;
background:#a0a0a0;
margin:0;
color:#fff;
}
h1 {
font-size:2em;
font-weight:normal;
line-height:0em;
color:#fff;
text-align:center;
margin:5px;
}
/*************
NAV
*************/
nav {
margin:20px;
padding:10px;
line-height: 1.1em;
padding-bottom:0px;
text-align:center;
}
nav ul {
text-align:center;
list-style:none;
padding:0;
margin:0 10px;
}
nav li{
display:inline-block;
}
/****************************
nav a links
*****************************/
nav {
background:#d0d0d0;
}
nav a, nav a:visited {
color:#FFF;
}
nav a.selected, nav a:hover {
color:#131c1f;
}
/***************************
Imaging
***************************/
#gallery {
margin:0;
padding:0;
list-style:none;
}
#gallery li {
float:left;
width:45%;
margin:2.5%;
background-color:#7f7f8f;
color:#fff;
}
#gallery li a p {
margin:0;
padding:5px;
color:#fff;
font-size: 0.8em;
}
#gallery p:hover {
color:#131c1f;
}
2 Answers
![martinjones1](https://secure.gravatar.com/avatar/ea31110d17ffdbc6cc964e64ed581479?s=96&d=https%3A%2F%2Fecs-static.teamtreehouse.com%2Fassets%2Fcontent%2Fdefault_avatar-445fbbabfc8dc9188fb5967fe43322ee0c3e0dd1e10f378bf8343784af5a13eb.webp&r=pg)
martinjones1
Front End Web Development Techdegree Graduate 44,823 PointsHi Martin,
I would first update some of the styling in your h1 tag to:
h1 { color: #333; line-height: 1.5; }
At the moment the h1 color is white on a white background, so does not appear like it is present, so not overlapping, just blending into the background color.
Following that, the image issue just appears to be a small syntax error on line 106, just remove the extra "," and it will work OK :)
If you click on the link below to the W3C CSS Validator, you can copy and paste in your CSS to test it
(https://jigsaw.w3.org/css-validator/validator)
Hope this helps,
![martin wong](https://uploads.teamtreehouse.com/production/profile-photos/8595042/micro_df9289a1-ecfc-4861-9490-2946e20238af_1_.jpg)
martin wong
4,799 PointsFinally got it working after realising!
Also that validator is very useful. Thank you!
martin wong
4,799 Pointsmartin wong
4,799 Pointshttps://w.trhou.se/ex7an8ujls
is my html/csss