Mike Jones
Mike Jones

Reputation: 21

How would you make an image stay in place but it stays with the browser or screen resolution

I asked a question a couple days ago but I dont think I was clear enough so I will clear it up. First let me show you two images and you will see what my problem is. This is what it looks like for me http://puu.sh/2NrEi.jpg but for people with different screen resolutions or have their browser zoomed in they see this http://puu.sh/2NrED.jpg and I dont know how I would stop this from happening.

Here is some of my code. (I totally suck at css)

 <style>
    #div1 {
    position: absolute;
        left: 542px;
    top: 432px;
    }
    #div3 {
    position: absolute;
        left: 264px;
    top: 433px;
    }
    #div4 {
    position: absolute;
    left: 1045px;
    top: 432px;
    }
    #div5 {
    position: absolute;
    left: 313px;
    top: 566px;
    }
    #divl {
    position: absolute;
        left: 542px;
    top: 460px;
    }
        </style>

Upvotes: 0

Views: 2348

Answers (1)

Harshit Tailor
Harshit Tailor

Reputation: 3281

Try something like this:-

<div class="main">
<div class="box size1">Div1 for rank information</div>
<div class="box size2">Div2 for center content</div>
<div class="box size1">Div3 for need help box</div>
</div>

css :-

.main
{
 width:100%;
}
.box 
{
 display:inline-block;
}
.size1 
{
 widht:20%;
}
.size2 
{
 widht:60%;
}

set width in percentage

Upvotes: 1

Related Questions