Display the Image in the Center of the Page

Display the image in the center of the page

Found this: How to Center an Image Perfectly in CSS, might help.

#img
{
    position:absolute;
    width:592px; /*image width */
    height:512px; /*image height */
    left:50%; 
    top:50%;
    margin-left:-296px; /*image width/2 */
    margin-top:-256px; /*image height/2 */
}

Making image align center of screen in html

Instead of Table, You can achieve the same with div and img

Working Demo

HTML

<div><img src="http://placehold.it/350x150"></div>

CSS

html, body
{
    height: 100%;
    margin:0;
    padding:0;
}

div {
    position:relative;
    height: 100%;
    width:100%;
}

div img {
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    margin:auto;
}

How to center an image on the middle of the page in css?

You should give a width to your img to align horizontally using margin-left:auto margin-right:auto.

 .inner {
   width: 800px;
   border:1px solid black;
 }

 img{
   display:block;
   margin:0 auto;
   width:200px;
 }

JSFiddle

Or you can align the img by making it inline-block and give a text-align:center to its parent

 .inner {
   width: 800px;
   border:1px solid black;
   text-align:center;
 }

 img{
   display:inline-block;
 }

JSFiddle

Display Image and Text in Exact Center of Div

You could use flexbox.
Here is your code solved using flexbox: https://jsfiddle.net/r49t61ka/
But I highly recommend you to take a look on this article: A Guide to Flexbox

.part{
  display:flex;
  justify-content: center; //Center the element horizontally
  align-items: center; //Center the element vertically
 }

<a href="URL">
    <div class="part1 part">asd</div>
    </a>
    <div class="part2 part">asd</div>
    <div class="part3 part">asdsd</div>
    <a href="URL">
    <div class="part4 part">asdsdsd</div>
    </a>

How to display images at the center of the page, and a button at bottom of the page

You can use display: flex; and use align-items to the elements centred vertically and justify-content to get them horizontally centred.

Now to get the button stick to the bottom, you can either use position: absolute; or position: fixed;

body {  height: 100vh;  width: 100vw;  display: flex;  align-items: center;  justify-content: center;  overflow: hidden;}
button {  position: fixed;  bottom: 0;  right: 0;  border: none;  color: white;  padding: 15px 32px;  text-align: center;  text-decoration: none;  cursor: pointer;  font-size: 20px;  width: 100%;  background-color: #2483E8;}
img:first-child {  margin-right: 1em;}

<img src="https://dummyimage.com/100x100/000/fff&text=image+1"><img src="https://dummyimage.com/100x100/000/fff&text=image+2">

<button class="button home" onclick="window.location.href='index.html'">HOME</button>

Display image in the center of screen when hovering on a link

I am not sure if this is what you want, but here you have a working example https://jsfiddle.net/vqxb20vg/2/

HTML

<div class="hover_img">
 <a href="#">
   A picture of my face<span><img src="/image.png"/></span>
 </a>
</div>

CSS

.hover_img { 
  position:relative;  
}
.hover_img a span { 
  position:absolute; 
  display:none; 
  z-index:99;
  left:50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
}
.hover_img a:hover span { 
  display:block;
}

How do I center my image gallery on a page?

I would just put text-align: center on .grid, knowing that it will trickle down

Or you can use flexbox which will give you an easier time overall:

.grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

How to make an image center (vertically & horizontally) inside a bigger div

Personally, I'd place it as the background image within the div, the CSS for that being:

#demo {
    background: url(bg_apple_little.gif) no-repeat center center;
    height: 200px;
    width: 200px;
}

(Assumes a div with id="demo" as you are already specifying height and width adding a background shouldn't be an issue)

Let the browser take the strain.

---

Related Topics