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

Posted by Aurelian Spodarec
Aurelian Spodarec
7,369 Points

Align centre etc..

Hi,

So i want too make the nav bar to expand like in this site and content be below.

I want it basically to have the background expand but position it like i want .

Heres what i did http://codepen.io/anon/pen/YPwWwK

but I'm aiming for this but i can't figure it out or it doesnt work.

http://www.gateway.ac.uk

2 Answers

Ryan Duchene
Ryan Duchene
Courses Plus Student 46,022 Points

Which of these designs is what you want?

Aurelian Spodarec
Aurelian Spodarec
7,369 Points

The first one :D wow thank you, you must have all this in a little finger . Im trying to learn different types of layout and the way you code it . I really like it though its a bit hardish but its nice and clean as i see it . Im sure in long run it will be really useful , or its just for me some new CSS tags maybe : p Thank you very much :smiley:

Ryan Duchene
Ryan Duchene
Courses Plus Student 46,022 Points

Haha, thanks! It just takes time and practice.

Aurelian Spodarec
Aurelian Spodarec
7,369 Points

I'm practicing your code all the time: D and i learn a lot from this because I can see how it's build and apply that logic and all to my own project :D thank you for this

Ryan Duchene
Ryan Duchene
Courses Plus Student 46,022 Points

Sure thing! :D I'm glad you're learning!

kirkbyo
kirkbyo
15,791 Points
kirkbyo
kirkbyo
15,791 Points

Hey Aurelian,

I am a bit confused on what you said here

I want it basically to have the background expand but position it like i want .

Are you wanting your nav elements centered? If so you could do something like this 

#nav {
  text-align: center;
}

Ozzie

Aurelian Spodarec
Aurelian Spodarec
7,369 Points

HI, i did that , but that the wrong way to achieve what i want : p

like i showed it on the website above http://www.gateway.ac.uk

kirkbyo
kirkbyo
15,791 Points

Are you interested in creating the drop down menu? Sorry I still don't really understand what you meant by having the background expanding but the way you want it

Aurelian Spodarec
Aurelian Spodarec
7,369 Points

xd lets say i never wrote anything and here is my first post :

This is what i want to do.

Basicaly, if you look at my page, well , navigation, is on the left, if you zoom it out , its always on the left. But i want to make it on centre and if you zoom it out , its stays in centre but i want to put there a logo and search bar too to it can't be text-aligned to centre because then a lll will get aligned and it wouldn't work.

Lets say the page is 1200px so the header and the content, but the header background expands all 100% of the screen all the time and the content is on middle.

I hope this is more clean.

Basicaly i want to make a reduplication of this , with the HTML and CSS but it won't even be on middle for first : p