I’m having a problem with my responsive website from my viewport sizes,
/* VIEWPORT < 768px */
It should be like this instead
Current:
/* VIEWPORT < 524 */
It should be like this instead
Current:
You haven’t contained your floats
#services{overflow:hidden;}
#slides needs it too. Remove your height. You put a band-aid on #slides by doing that height.
#media too
You’ll often find that many websites offering code don’t actually know what in the world they are doing. Actually, most websites in general don’t appear to be very good at coding HTML/CSS.
Please do my suggestion.
1 Like
Should I add overflow:hidden from my style.css or from my media.css ?
and remove the height from #slides from the media queries?
I already added overflow:hidden from my style.css [#services part]
Doesn’t matter. I assume media.css only has media queries in it? If that’s the case (or you were referring to only putting my code in media queries) then put it in style.css
Make my styles globally so every size screen gets them. Doesn’t matter where.
How can I move this searchtext from the center?
Thanks Ryan for helping.
Do you mean TO the center? It’s not in the center right now.
For your max-width:524px media query, add in text-align:center to “nav ul li.last” rule.
The search magnifying glass will be slighly out of view so you might want to remove hte left margin on “nav ul li div input[type=submit]”
Is it okay now from your browsers?
I’d recommend going to the Review section of Sitepoint forums and getting reviews there. Some notes though…
Is that 10px green border at the top of the screen intentional?
I wish the page was more fluid instead of setting a whole bunch of media queries but yours works…
In the smallest view, there is a good 70-100px gap at the top where it’s just whitespace. That’s due to #headerWrap. Set it to 0 for the smallest view.
Overall, it’s fine.
The tutorial was from 2012. What do you mean from the #headerWrap, from the viewport 524px?
#headerWrap {
margin: 0; ?
}
Yup. I don’t believe you have a #headerWrap in the 524px media query though so you’ll need to add that rule in.
viewport 524px
#headerWrap {
margin: 0; ?
padding: 0 ?
}
Are you good also at javascript? I’m still not good at CSS and I got to learn javascript too.
What happened when you tried it?
Good compared to who? It’s all relative.
I know enough Javascript to get by, but I certainly wish I was more proficient at it. My money maker is HTML/CSS.
^ Went way from the top
How about jQuery? So you’re a CSS developer?
Again, jquery I sorta know some but I’m not THAT strong.
I’m a front-end developer but I mainly only work on HTML/CSS stuff. Maybe some PHP once in a while.
My coworkers and bosses know about my CSS strength though so they (wisely) let me do most of my work in CSS.
Do you work also with designs or mainly CSS?
I don’t design pages from scratch (absolutely terrible at designing) but I do offer suggestions on designs; features etc.
1 Like
do yo u have a website to share like your portfolio?