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

CSS

What is this ? first time i see this

What , why is this nested ?

    #logo
    {
    }

        #logo h1
        {
            float: left;
            margin: 0 0.35em 0 0;
            padding: 0.25em 0.2em 0.25em 0.2em;
            font-size: 3.25em;
            letter-spacing: 0.05em;
        }

        #logo span
        {
            line-height: 4.5em;
            letter-spacing: 0.025em;
            font-size: 0.9em;
        }
Ron McCranie
Ron McCranie
7,837 Points

They might be using a CSS pre-compiler like Sass or Less, with the compile settings turned to 'nested'

I didn't really looked at Sass so i don't know how it works etc.. : p but thank you for info , it will be helpful when i gonna know a bit more of it ^^

2 Answers

Hi Aurelian!

This code is not actually nested it has just been incorrectly indented. I hope I managed to clear up any confusion!

-Luke

Hi Luke!

What do you mean ? I mean the logo is in the logo etc... that basically useless?

If you look at the code below, it is the exact same code but with correct indentation:

#logo
    {
    }

#logo h1
    {
        float: left;
        margin: 0 0.35em 0 0;
        padding: 0.25em 0.2em 0.25em 0.2em;
        font-size: 3.25em;
        letter-spacing: 0.05em;
    }

 #logo span
    {
        line-height: 4.5em;
        letter-spacing: 0.025em;
        font-size: 0.9em;
    }

Basically in this case you can just totally remove the ID "logo" selector as it is essentially doing nothing.

I hope this helped clear it up.

-Luke

Wow seriously ;d

I though this is a bit messy, I'm trying to learn how to make a fleecy layout for mobile and desktop form this site http://html5up.net

And I'm learning 5 one from bottom Verti.

The CSS is all over the place, in my opinion is messy . The HTML 5 is worth a look because i think its pretty clear and nice. Same as comments on CSS are nice and give a nice idea how to make everything neater .

Thank you :)

-Aurelian

I know, it can be misleading the way that they have laid it out.

Nice, good luck with learning that!

Maybe report it to the creators of the site? Judging from the CSS you have posted it here it doesn't seem to be indented or presented well at all.

No problem!

-Luke

Its not present well at all! I can ensure you!

The CSS files are horrible, to style the layout, you have go throw like 5 CSS files and if you combine them, you'll get the proper layout. Its just messy! The webpage is nice , but the CSS code , oh come on . Do you know any nice responsive desktop, mobile webpages that i can learn from?

Oh i didn't even looked it properly ; p
It closes on it self, why put it there anyways ;d

-Aurelian

I'm sad to hear that Aurelian! Maybe look for somewhere else to learn about it.

What are you looking to learn Aurelian I might have a link that could really help you out!

I don't know, but it makes the CSS very cluttered and hard to read in my opinion.

I did the foundation on the flex box etc.. but well what i do , i look at somebody else code and try to learn it.

Facebook have like best developers so they know how to write it very well. So its a good way to leanr , to look at their code. But their page is not responsive. Im trying to learn something that i can re-do and see how it works in my own code.

Have you checked the CSS? yeah its hard to read even if its neat . The order and that stuff.. grr.

Nice! That's a very good way to learn things.

They do have very talented developers working over there so looking at their code can never be a bad thing! The page that we are on right now is responsive. Try re-sizing it and you will see!

I haven't yet but I can imagine, from what I have seen of that site, that it is quite messy!

Yes TreeHouse!

When i learn , i always resize it to half screen and zoom it so i get the tablet view and it expand to 100% on width and quite well on height too. This way i will see more and its less distracting.

Treehouse, uses a lot of JS from what i can see so for me using media queries to learn from here it would be a bit pointless. If you know what i mean.

Wayne Priestley
Wayne Priestley
19,579 Points

Hey Aurelien,

Congratulations on becoming a MOD :)

Hi Wayne Priestley!

Thank you :D

I actually though about MOD, and the message arrived asking me if i want to me a MOD on the same day hah (although i checked my email next day [friday] ) :smiley:

It's strange sometimes when you think about one think in your mind and that think happens , its just unbelievable, its crazy , thats happen in life , in real life.