01.)
The best option to make it wider is to make the whole profile wider:
Replace the red 00 with the width of the image. To adjust the height, you'd use this code, replacing this 00 with the height of the image:
#extendedProfileBody #header h1 {height: 00px; }
02.)
The top navigation bar is available on the new version of the profile, but not the old version. You'd have to switch to get them, or, alternatively, use custom sections to create your own mock top navigation bar.
03.)
Pixels are just a form of measurement. If you really want all the nitty gritty, just google "pixels" and see what you get, but you don't really have to understand them to use them. With the exception of matching sizes to images, you just basically eyeball the height and take a guess. The more you use them, the more you'll get to a point where you'll be able to guess height fairly accurately.
To scroll, you need to specify a height and then set the overflow to "auto":
#[section name] {height: 00px; overflow: auto; }
04.)
I'm not sure what you mean by extra stuff. Could you give me a link to her profile and tell me what specifically you're talking about?
05.)
I believe there is a way to do it with midi's, but you can also do it by putting the song you want into your multimedia section and then using this code to hide it:
#multimedia h2 {display: none; }
#multimedia {position: absolute; text-indent: -5000px; }
#multimedia object, #multimedia embed {width: 1px; height: 1px; }
06.)
Answered here, post three.
07.)
Same as you do in your signature: [url=URL][img]IMAGE URL[/img][/url]
08.)
Answered here, post four.
09.)
See 8.
10.)
Set up a system for yourself.
For instance, I group all the codes together by which section they edit. You can make notes in your CSS that won't mess anything like this:
So, what I do is label each section and have the codes under it. This is a snippit from my current profile:
Quote:
/* SIGNATURE */
#signature {position: relative; top: -200px; z-index: 3; }
#signature h2 {background: url(http://img.photobucket.com/albums/v631/brianna_aisling/profiles/ava/signature-h2.gif) top center no-repeat; height: 120px; }
/* LINKS */
a:link, a:visited {color: #C00000; }
a:hover {color: #3C0404; text-decoration: none; }
a:active {color: #990001; text-decoration: none; }
#about a:link, #about a:visited {color: #FFF; }
#about a:hover {color: #F3ECE2; }
#about a:active {color: #990001; }
Instead each group I usually start with the generic and go specific. Like the container element (#about, #friends, #comments), then the header (#about h2, #friends h2, #comments h2), and then the pieces (#about .links, #friends #friendGroup li, #comments .caption). That way, I know where each code is, and if I want to add or change something, I simply find that section again and add it or change it.
Just find a system that works for you and stick with it.
Help me?.... sweatdrop 
