CODEWITHSUNDEEP
htmlcss
DoubleP90
DoubleP90

Reputation: 1249

Div card misplacing

This is my Portfolio i'm working on

The first time you enter the website the yellow Wakey card is below the sidebar (it should be on the right side of the sidebar.

And after refreshing the website it goes into the right position What can be causing this?

This is the css of the content div where the card is located

     #content
{
    width:70%;
    position: absolute;
    display: inline-block;

}

And this is the sidebars

#sidebar
{
    background-color:#4b4b4b;
    margin:0px;
    margin-left:5%;
    width:400px;
    height:1000px;
    -moz-box-shadow: 0px 0px 25px #000000;
    -webkit-box-shadow: 0px 0px 25px #000000;
    box-shadow: 0px 0px 25px #000000;
    display: inline-block;
}

You can see the html from the website so i won't post it to keep it short

On IE it's displaying properly, it gives me this problem on chrome

UPDATE: I've changed the #content-wrapper display to display:inline; now, but it didn't help

Upvotes: 0

Views: 56

Answers (1)

Lucky Soni
Lucky Soni

Reputation: 6888

Why not float your sidebar? and let the #content position itself in the normal document flow.. you might want to set width for #content also..

#sidebar
{
  background-color:#4b4b4b;
  margin:0px;
  margin-left:5%;
  width:400px;
  height:1000px;
  -moz-box-shadow: 0px 0px 25px #000000;
  -webkit-box-shadow: 0px 0px 25px #000000;
  box-shadow: 0px 0px 25px #000000;
  float: left;

}

#content
{
 float: left;
}

Upvotes: 1

Related Questions