stubbornly floating to the right although there is no command

Question

http://jsfiddle.net/6j7zC why is the adminbox floating although there is no command?

http://jsfiddle.net/6j7zC/1** the fixed div center not working properly

.adminbox
{
        width: 200px;    
        height: 17px;
        margin-top: 20px;  
        padding: 20px; 
        font-size: 12px;   
        color: white;
        background-color: black;
        font-size: 12px;           
        font-family:"Gears of Peace";
}

Um, there is a `float:right;` command in the CSS for the adminbox in the first fiddle. It would help if you kept only one rule per line so you'd see them better. — JJJ, Aug 26 '13 at 08:44
its because of the padding, you have given 20px padding there. — N8FURY, Aug 26 '13 at 08:49

score 0 · Accepted Answer · edited Aug 26 '13 at 08:56

0

Lines 57-61 of the css...

.adminbox
{
    width: 50px;
    height: 35px;
    font-family: Verdana;
    font-size: 24px;
    margin: auto;
    color: green;
    background-color: transparent;
    float: right;
    margin-top: 4px;
    margin-left: 60px;
    font-style: italic;
}

There's a float: right in there ;)

edited Aug 26 '13 at 08:56

Sasidharan

3,676
3
19
37

answered Aug 26 '13 at 08:47

Sj.

1,402
1
12
9

thank you. I made an edit to my question thank you very much. – Aug 26 '13 at 08:47
what about the 2# question? – Aug 26 '13 at 08:58
At the moment it's doing all your CSS is asking it to do. A common fix would be to say left/right: 50%; and then add a negative margin half of the div's width. For instance: .password {position: fixed; width: 370px; left: 50%; margin-left: -185px;} – Sj. Aug 26 '13 at 09:06

score 0 · Answer 2 · answered Aug 26 '13 at 08:54

0

For your second question; it's exactly drawing your box as per your css

top: 50%;    right: 50%;

and you have mention width and height to the password box

width: 370px; height: 200px;

There is noting unusual as per your code behavior on the output.

Your query is not clear; what resolution you are targeting your POC/website/app?

answered Aug 26 '13 at 08:54

Akki619

2,386
6
26
56

How can I make it exact middle of the screen? – Aug 26 '13 at 08:56
Please research on stack-overflow; questions similar to positioning center is already there with the solutions. – Akki619 Aug 26 '13 at 09:18

stubbornly floating to the right although there is no command

2 Answers2