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

Make Nav Bar Longer on my website home page in css.

hello everyone if someone can please help me out i want to make the nav bar longer on my home page of my website if someone can please help me out

www.bcordeirophotography.com

14 Answers

Give .header-elements-wrap a width of 100%. You can do this in Wordpress under appearance > edit > styles.css.

It's best practice to do this as a child theme of the theme you chose so that you are not modifying the theme core files but that is up to you. You could still go into style.css and modify it.

HI Brian! What do you mean you want to make your nav bar ? you mean the links? how long do you want to be it ? whats your plan?If you want all the way to expad you should do 100% if not please explain it to me and i try to help.

i may get it, you can make more padding from li a or you can make your nav bar longer by setting more px if your using pixels and make padding more , thats what i see

If you go on my website the nav bar is a little faded but at the ends of the nav bar I want it to go all the way threw I don't want any space at the end of the nav bar

Correct im so sorry if i confused you i just want it to stretch all the way on both sides

you want this to look like this? http://scr.hu/2icp/kp4r8 and the links to do more space right? or you just want the links in the box to strech on left and right more?

can you snap a different image aurelian i cant see the nav bar if you dont mind i like the links to stay i would want the background nav to go all the way to the right and left.

allright , i think i get you now. Check this http://scr.hu/2icp/7dsai

yes bingo :) that is what i would like thank you so much

Allright, the best think would be if you coud paste me the entire code of your box . with css so i can have look and see what is needed to be changed.

ok i will screenshot the code.

hey, could you paste HTML in the HTML box and CSS in the CSS box? http://codepen.io/pen/

it would be faster for me test new code

this is a word press theme i don't think i can do that

if im right, you can look in wordpress HTML and CSS code if not well. I dont know how to use wordpress but if you cant edit the code then i have no idea how to expand it to 100%. Try to put the same question but insted of looking for help in CSS look in the category Wordpress, people there will certnaly help you and will know more how to use themes and all that stuff that wordpress offer .

oh ok i apologize thank you so much for all your help.

No probem :) Treehouse is awesome! :D

Im still trying to get use to it lol i just signed up a couple of days ago

so your new to wordpress? you started using wordpress 3 days ago?

Jason thank you do much man you nailed it TeamTree house Rocksss lol

Aurelian i just sign up for teamtreehouse 3 days ago

So you can look in the code :D I was 50% sure because i saw some code when my mum was earning wordpress.

So you in threedays made that website? form the first day?

jason how do i make a child theme ???

The brief answer - Create a new folder with the name of your child theme name and then a stylesheet called something like custom.cssthat will reside in that folder.

In that new file, the first lines of it should be something like:

/*

Theme Name: childoftwentythirteen

Description: Child of twenty thirteen theme

Author: Jason Taylor

Template: twentythirteen

Version: 1.0.0

*/

@import url('../twentythirteen/style.css'); /* this will append the original theme stylesheet*/

/* All of your custom styles go here. Your basically putting all of your modified code after importing the original so that you are not destructive with the core stylesheet. */

You'll also need to switch your theme to the actual child theme in order for this to work properly. Hope it helps and hopefully I didn't leave out anything important :)

i join team tree house to learn more word press and editing themes and i want to design my own theme one day.