0

I found a jquery code that rotate images inside a div and I want to position this div to the center of the page. I have this CSS for the images

#rotating-item-wrapper {
position: relative;    
}

and this for the div

.rotating-item {
display: none;
position: absolute;
top: 150px;
left: 200;
}

How I manage to center the whole process to the center?

justcurious
  • 839
  • 3
  • 12
  • 29
Antonis sinotnA
  • 23
  • 1
  • 10

2 Answers2

0

using margin and position tend to work in these sorts of situations:

HTML:

<div id="center-div"></div>

CSS:

#center-div {
    position: relative;
    margin: 0 auto;
    width: 50px;
    height: 50px;
    background: red;
}

here's a jsfiddle: http://jsfiddle.net/mwyLz9rt/

0

Add this code to the div you wish to center:

.centered {
  position: absolute;
  margin-left: 50vw;
  margin-top: 50vh;
  transform: translate(-50%, -50%);
}

Also, next time try to provide us with a jsfiddle example so we could understand the problem more vividly :)

Here's a demo of the above code JSFIDDLE

MaartenPAC
  • 43
  • 2
  • 12