2 replies [Last post]
dcour21
dcour21's picture
Offline
newbie
Last seen: 2 years 42 weeks ago
Timezone: GMT-4
Joined: 2016-10-23
Posts: 2
Points: 3

My url
//mod edit: link fixed. ~gt
Hello, I am quite new to CSS and I am having one issue with my page. The main picture on my homepage does not move with the rest of the content and I am not sure how to correct this. I am guessing this line of code [background: none repeat scroll 0 0 transparent] has something to do with the movement and placement of the other content, but for some reason I can not successfully apply it to the picture's code. Any help would be greatly appreciated. Thanks

dcour21
dcour21's picture
Offline
newbie
Last seen: 2 years 42 weeks ago
Timezone: GMT-4
Joined: 2016-10-23
Posts: 2
Points: 3

Oh yeah, I forgot to mention

Oh yeah, I forgot to mention where I wanted the picture positioned. I need it centered so it is directly above the horizontal black line near the bottom of the page.

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 19 hours 37 min ago
Dallas
Timezone: GMT-5
Joined: 2004-06-25
Posts: 9742
Points: 3821

An image defaults to being

An image defaults to being inline and is controlled by the text-align property. Probably easier to deal with is to declare the image block and use the margin property to center it.

<div class="image-box">
  <img src="my-pic.jpg"
       alt="...">
</div>

.image-box {
    text-align: center;}
 
or
 
.image-box img {
    display: block;
    margin: 0 auto;}

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.