# Did i do something wrong?

**URL:** <https://forum.freecodecamp.org/t/did-i-do-something-wrong/174839>\
**Category:** General\
**Created:** [February 15, 2018, 10:54pm UTC](https://forum.freecodecamp.org/t/did-i-do-something-wrong/174839 "2018-02-15T22:54:13Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![Bego96](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/bego96/32/73440_2.png) [@Bego96](https://forum.freecodecamp.org/u/Bego96)\
**Post date:** [February 15, 2018, 10:54pm UTC](https://forum.freecodecamp.org/t/did-i-do-something-wrong/174839/1 "2018-02-15T22:54:13Z")

</div>

Im trying to size and move a picture but its not working, its stuck in this position no matter of what:

[[Album] Imgur ![](https://global.discourse-cdn.com/freecodecamp/original/3X/4/6/46b525d33bd93db2f04c56c87045b2feb11ad39d.jpg "Imgur") ](https://imgur.com/a/hzH4A)

My HTML:

```auto
<!doctype html>
<html>
<title>Something</title>
<head>
<link rel="stylesheet" type="text/css" href="Something.css">
    </head>
    
<bod>
    
   <div class="container">
    <h1>Something</h1>
    </div>
 
    <div id="image">
    <img src="cool.jpg">
    </div>
    
    
    
    
    
    
    
    
    
    
    
    
    </bod>
</html>

```

CSS:

```auto
.container {height: 300px; width: 300px; margin: 0 auto; position: relative; left: 25%;}

#image {width: 100px; height: 100px; position: absolute;}

```

Any ideas? I managed to move text. But image is not responding at all.

---

<div class="post-metadata">

**Author:** ![lupuselit](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/lupuselit/32/87299_2.png) [@lupuselit](https://forum.freecodecamp.org/u/lupuselit)\
**Post date:** [February 15, 2018, 11:16pm UTC](https://forum.freecodecamp.org/t/did-i-do-something-wrong/174839/2 "2018-02-15T23:16:15Z")

</div>

You are changing the properties of the div instead of the image. try changing #image to the img tag. Also, you misspelled ‘body’ it’s written ‘bod’ you may want to change that.

If you wanna center and change the image width you can do the follow

```auto
<body>
   <div class="container">
    <h1>Something</h1>
    </div>
    <div>
      <img id="image" src="https://i.imgur.com/paaUV5b.png">
    </div>
</body> 

```

```auto
body {
  text-align: center;
}

.container {
// margin: 0 auto; don't need this line
}

#image {
  width: 100px; 
  height: 100px; 
}

```

---

<div class="post-metadata">

**Author:** ![Bego96](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/bego96/32/73440_2.png) [@Bego96](https://forum.freecodecamp.org/u/Bego96)\
**Post date:** [February 15, 2018, 11:33pm UTC](https://forum.freecodecamp.org/t/did-i-do-something-wrong/174839/3 "2018-02-15T23:33:28Z")

</div>

Thank you alot, my brain is just not working properly it seems like. Also, why doesnt moving picture to top or bottom work with % but it works with px and cm instead?

---

<div class="post-metadata">

**Author:** ![lupuselit](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/lupuselit/32/87299_2.png) [@lupuselit](https://forum.freecodecamp.org/u/lupuselit)\
**Post date:** [February 15, 2018, 11:50pm UTC](https://forum.freecodecamp.org/t/did-i-do-something-wrong/174839/4 "2018-02-15T23:50:54Z")

</div>

can you give me an exemple of which properties you’re trying to change?

---

<div class="post-metadata">

**Author:** ![Bego96](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/bego96/32/73440_2.png) [@Bego96](https://forum.freecodecamp.org/u/Bego96)\
**Post date:** [February 16, 2018, 12:04am UTC](https://forum.freecodecamp.org/t/did-i-do-something-wrong/174839/5 "2018-02-16T00:04:22Z")

</div>

So i used “position : relative” in css in #image and used “top : 30%” and after that “bottom : 30%” but it didnt work, so i used cm instead of % and it worked. And why did aling-text: center put image to the center too?

---

<div class="post-metadata">

**Author:** ![lupuselit](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/lupuselit/32/87299_2.png) [@lupuselit](https://forum.freecodecamp.org/u/lupuselit)\
**Post date:** [February 16, 2018, 10:27am UTC](https://forum.freecodecamp.org/t/did-i-do-something-wrong/174839/6 "2018-02-16T10:27:00Z")

</div>

About this percentages thing, I don’t really know. Also, isn’t better for positioning to use margins or padding?

This property describes how inline-level content of a block container is aligned.  
Since ![]() is an inline-block element, this property applies to ![]() as well. as explained here [Why does text-align not only center text, but images, too?  
 ](https://stackoverflow.com/questions/13097902/why-does-text-align-not-only-center-text-but-images-too)

---

<div class="post-metadata">

**Author:** ![ILM](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ilm/32/363239_2.png) [@ILM](https://forum.freecodecamp.org/u/ILM)\
**Post date:** [January 17, 2021, 8:26pm UTC](https://forum.freecodecamp.org/t/did-i-do-something-wrong/174839/7 "2021-01-17T20:26:49Z")

</div>

Closed on January 17, 2021, 8:26pm UTC