Joomla Templates Club 406,261 posts

[tulio Friend tulioJoin date: May 2008Posts: 123Downloads:0Uploads:29 Thanks: 14]

#176722

HI There,

Please check: http://recipemedico.com/corc/index.php

How can I center the image, and how can I know the size of the image so it can fix the width of the template.

Thanks,

Tulio

[khoand Friend khoandJoin date: February 2011Posts: 4500Downloads:0Uploads:179 Thanks: 169 Thanked: 1166 times in 1060 posts]

#451445

You replace the code from /templates/ja_zeolite/css/template.css

body#bd {
background: url("http://www.recipemedico.com/corc/images/fondo.jpg") no-repeat scroll 0 0 transparent;
color: #666;
padding: 0;
margin-left: 30;
}
with

body#bd {
background: url("http://www.recipemedico.com/corc/images/fondo.jpg") no-repeat scroll center center transparent;
color: #666;
padding: 0;
margin-left: 30;
}

[tulio Friend tulioJoin date: May 2008Posts: 123Downloads:0Uploads:29 Thanks: 14]

#457137

Hi there,

Please check http://www.ordencaballerosrosacruz.com

The background image is centered but in these other pages for example it goes out of range in screen resolution 1600 x 900.

http://www.ordencaballerosrosacruz.com/contenido-1/actualidades
http://www.ordencaballerosrosacruz.com/contenido-1/mensaje-del-maestro

What do I need to change in the template css so the image can get centered and scroll down in all pages and all resolution size?

Thanks,

Tulio

[HeR0 Friend HeR0Join date: August 2011Posts: 3626Downloads:0Uploads:61 Thanks: 33 Thanked: 588 times in 549 posts]

#457383

Hi Tulio,

Please provide screenshots where you mentioned about the background image on your site?

Regards.

[tulio Friend tulioJoin date: May 2008Posts: 123Downloads:0Uploads:29 Thanks: 14]

#457406

Hi Hero, thanks for your reply.

Please check image 1 : http://www.ordencaballerosrosacruz.com/contenido-1/mensaje-del-maestro
image 2 : http://www.ordencaballerosrosacruz.com/contenido-1/actualidades

This occur with articles pages. Not in Contact or registration pages.

Thanks,

Tulio

---

Attachments:

1. 
2. 

[HeR0 Friend HeR0Join date: August 2011Posts: 3626Downloads:0Uploads:61 Thanks: 33 Thanked: 588 times in 549 posts]

#457464

Hi
Please open file templates/ja_zeolite_ii/css/template.css and find

body#bd {
background: url("../images/wpbg.jpg") no-repeat scroll center center transparent;
color: #D8C772
margin: 0;
padding: 0;
}

then replace to

body#bd {
background: url("../images/wpbg.jpg") repeat-y scroll center top transparent;
color: #D8C772
margin: 0;
padding: 0;
}

Hope you like this solutions
Regards,

[tulio Friend tulioJoin date: May 2008Posts: 123Downloads:0Uploads:29 Thanks: 14]

#457906

HI Hero, thanks for your reply.

If you check it repeats the image when scrolling down but can it just scroll the content and not the image?
Because it looks like a paste image one above the other.

Thanks,

Tulio

[HeR0 Friend HeR0Join date: August 2011Posts: 3626Downloads:0Uploads:61 Thanks: 33 Thanked: 588 times in 549 posts]

#457946

Hi Tulio
Because background image height is smaller than page height so you need repeat background image. If you use scroll the content, your site layoutwill is not god.
You can create scroll content as below
Please open file templates/ja_zeolite_ii/css/template.css and find code

#ja-container .main {
padding: 10px 0 0;
}
then replace to

#ja-container .main {
height: 950px;
overflow: auto;
padding: 10px 0 0;
}

Regards,

[Author]

Posts