How do I get the background to float right behind the login box even when scaling the window? Example is http://www.khcs.org/wp-login.php
In the given link, they simply use one big image as the background: http://www.khcs.org/wp-content/uploads/2013/01/KHCS-Login_bkg4.jpg
What you are really trying to achieve? Explain briefly with your login page link also.
Basically I want that 3d graphic to sit right behind the login box so the logo is on top and as you scale the page or anything it will stay right behind it. not so worried about the big background color I am mainly trying to achieve that effect.
Okay. Then go to the Erident Custom Login and Dashboard Settings page.
On the Login Screen Background section, and put your image link in “Login Screen Background Image”
Now for the “Login Screen Background Repeat” option select “No Repeat” and for “Background Position” select “Horizontal Position” – “center” and “Vertical Position” to “center”.
That did not quite do what I want. It stays in the center but not behind the login box as you scale the browser window. Basically I want that 3d image to always stay in that position with the login box. If you go to the image below you will see how I want it to look and then if you go to the website listed last and scale the browser you will see what I mean. Thanks for the help
I’m not able to see your background. It is referencing to your “localhost”
Please upload it to the server and change the path.
Okay scratch the last stuff think I got it. Is there way to change the height of the login box?
and is there a way to absolute position a background image so it won’t move so say a portion stayed behind the login box at all times?
First I think you need to clear the “Login Form Background Color” and “Login Form Background Image”.
Now both images are puzzled!
Okay I have done that. Now the background image is there but I need it to stay in a certain spot behind the login box even when you scale the browser window. The desired effect is the image below.
Change the background “vertical position” to top.
Now we are almost there. You can do two things to bring the background position down. Either add some white space on the top of image itself.
Or you need to edit the core css. You have to add “background-position-y: 50px;” to “body.login” on “wp-login.php” file
Change the background “vertical position” to “top” and add this image instead of your background image: https://s3.amazonaws.com/uploads.hipchat.com/26718/162670/mb9ms3hnnn3ernn/KHCS-Login2.png
This will do the magic !!!
AWESOME!! thanks so much. WOrks perfect sorry for all the run around.
Killer !!!! Your Login page looks awesome now!!!
Don’t forget to give a 5 star to my plugin. http://wordpress.org/support/view/plugin-reviews/erident-custom-login-and-dashboard
- The topic ‘Background Float’ is closed to new replies.