I'm pretty happy with it! https://subeta.net/pets/Keme

I still have to write a story and find some treasures for him, but the worst part is over with. Any comments/tips/criticism?

Also, is the resolution looking OK for you? I coded it in Chrome and it looks good to me, but Maskros was saying that it didn't align right for her in Chrome. Please ping me. (:

Huge thanks to Maskros for answering a few questions about coding!

first i will say, design-wise it looks great. though i might suggest making the main section just a little more opaque, and/or you might want to consider a neat trick to make the background of that box translucent while keeping the text fully opaque, which is this: instead of using a hex code to set the background color, use an rgba code (red, green, blue, alpha - which means opacity). you can easily convert a hex color to rgb on this site, and then just add the desired opacity to the end of the number it gives you. so for example, that div's background is currently set to 0.65 opacity. to get the same effect, you would replace this line:

background-color: with this:

background-color: rgba(114,165,164,0.65)and then you could get rid of the line declaring opacity. if that's something you're interested in doing, of course. i just think it's handy because it gives you more freedom while keeping the text at maximum readability. you can also do a combination of the two (slightly lower opacity for the background, and then slightly lower opacity for the whole thing) to make the text just a little bit translucent while still keeping it somewhat more opaque than the background.

regarding alignment issues, there is one. you've aligned the tabs on the side using absolute-right-positioning (position:absolute; right:XXpx) so that they expand to the left... except that means they move depending on the size of the browser window. i.e. if i make my browser window wider, the right side of the page is further to the right, so the tabs move further to the right; and if i make my browser window narrower, the right side of the page is further to the left, so the tabs move further to the left. so everyone with a browser window that is not exactly the same size as yours will see those tabs as misaligned. unfortunately you can't use relative-right-positioning (position:relative; right:XXpx) to fix this, as that makes the tabs extend to the right instead of to the left; and as far as i know, you can't change their origin point (the point on the page from which their position is calculated) because they are already children of the div so it's not like you can place them in a new div. the only solution i can think of is to just move the tabs to the other side of the box and have them extend to the right.

uh... let me know if any of that was confusing or if there's anything else you'd like help with.

Thank you very much for the tips! I originally wanted the text box background more opaque than it was, but the text was going opaque too, and I couldn't figure out how to fix it. This completely solves my problem! I did type in the new code like you said, but now the text box background is gone. Do you know why that is?

I'll work on re-positioning the div tabs next. I didn't want them to cover up the background phoenix at all, but I guess it's going to have to be that way. I'm thinking I'll try sliding everything over to the left so it doesn't cover as much of the bird.

no prob. the reason the box disappeared is because you left out a semicolon between declaring the background color, and the border. and i get what you mean about the tabs; maybe someone smarter than me knows of a better solution.

Oh, haha. My bad.

Well your explanation for why the tabs aren't aligning seems pretty spot on to me, and that means there is no solution. Thanks so much for your help and thanks for teaching me a little bit more about coding! :)

Congrats on finishing! Just so you can see, this is what the profile looks like for me in Chrome.

Oh, thanks for the picture! For me in Chrome, the background fills up the entire screen. Do you have any idea why there's a random bar of color at the top for you? :/

I'm not sure - but I don't see the bar when I view the profile in either FireFox or Edge. In both of those the background image fills the screen.

That's odd. I guess there's nothing I can do about what you see in Chrome then. Thanks for the heads up though! It's good to know.

Yeah, browser discrepancies are the most annoying imo :/

Yes. Despite our best efforts, nothing ever works out perfectly, does it? ;)

someone i made a profile for was having the same problem, but it's odd because i use chrome too and i'm not seeing anything like that so i really don't know what the reason could be.