Tessisamess

Previous | Next

Dropbox

Hey there!
Welcome! Questions, comments, concerns? You're in the right place, buddy! All comments are screened for privacy, but if you'd rather drop me a line privately, my email is always open at tessisabiiitch[at]gmail. Please ask questions about specific codes and layouts on the original entry. Thank you!
xo Tess
Other help pages Questions: Generator Documentation Questions: Layout Shop Mod Contact: RP Resources
Thanks for stopping by!

Comments

Apr. 27th, 2017 07:47 pm (UTC)
Hey, I'm sorry for the delay! I'm so behind on everything right now, haha. Okay so! When working with the background, you have a number of positions you can choose from; there are standard positions like bottom left or you can get pixel specific like 10px 20px and it will translate into 10px to the left and 20px from the top. You can shorthand these elements into background rather than declaring background-color, background-image, background-repeat, background-attachment, background-position and so on (super tedious lmao.)

So what you'll want for that is:
background:#123a2f url(IMAGE)bottom right no-repeat fixed;

And then you can change bottom to either top or center if you want it to sit differently.

A quick background example for reference:
background:#123a2f url(IMAGE)bottom right no-repeat fixed;

Is shorthand for the following (order of declarations doesn't usually matter for the background shorthand unless you're declaring specific px positioning):
background-color:#123a2f;
background-image:url(IMAGE);
background-position:bottom right;
background-repeat:no-repeat;
background-attachment:fixed;


The only thing you can't shorthand into it is background-size, which is a great declaration to use for fullsize wallpaper backgrounds to resize fluidly with monitor size. Some examples of this declaration:

background-size:cover; covers the height/width of the screen as best as possible without getting cut off
background-size:100% auto; 100% width and automatic height
background-size:auto 100%; 100% height and automatic width
background-size:50px; great for resizing a repeating pattern that you want smaller without editing the image


I hope that all helps with any background stuff!