Joomla Templates Club 406,261 posts

[cmgaskell Friend cmgaskellJoin date: September 2014Posts: 36Downloads:0Uploads:17 Thanks: 14]

#201697

I’m having several spacing issues on the masshead and modules on the home page.

1. Center image in masshead
A. Also, is it possible to add buttons in the center just below the image?

2. Decrease top, bottom, left, and right padding on all intro modules
– Ive already added the following in the custom.css with no results either way.

.row-feature {
padding-top: 1px;
padding-bottom: 1px;
}
.row-feature.inview {
padding-top: 1px !important;
}

3. Increase logo padding on main menu

Thanks in advance for the help! I can generally find the answer to these types of questions in the forum already but all of the solutions haven’t changed anything. 🙁

– Cary

---

Attachments:

1. 
2. 

[Adam M Moderator Adam MJoin date: May 2014Posts: 5159Downloads:33Uploads:66 Thanks: 95 Thanked: 1271 times in 1235 posts]

#551133

Hi Cary,

Please open file root_folder/templates/ja_sugite/css/custom.css and add appropriate CSS rules as below :

1. To center slideshow image :

.ja-ss .ja-slideshow .container {
margin: 0;
position: static;
}
.ja-ss .active.leftright .ja-ss-sprite.first {
left: 50%;
margin-left: -229px;
}

2. To increase padding around logo :

.logo-image {
padding-top: 20px;
padding-left: 20px;
}

3. To decrease the space between slideshow and feature intro :

@media screen and (min-width: 992px) {
.row-feature {
padding-top: 50px;
}
}

4. To decrease the space between feature intro heading and content :

.row-feature .row-feature-title {
margin-bottom: 30px;
}

5. Last thing is about the space between main content and left / right edges. By default, the width of container is 1180px, so these spaces will increase when visitor use big screen and decrease when visitor use small screen.

[jooservices Friend jooservicesJoin date: October 2014Posts: 8556Downloads:0Uploads:130 Thanked: 1245 times in 1121 posts]

#551141

Hi there,
Please split your issue into separate topic. It would help us easier to follow & speed up your issue.

And about your custom css. Actually please update your css path from top to increase css priority 🙂

Thank you,
Viet Vu

1 user says Thank You to jooservices for this useful post

1. cmgaskell

[cmgaskell Friend cmgaskellJoin date: September 2014Posts: 36Downloads:0Uploads:17 Thanks: 14]

#551179

Awesome, thank you!

Is it possible that it’s the size of my screen (fairly wide) effects the position I’m seeing the logo in? For instance -229px doesn’t show centered for me, but -205 does.

Also, is there a way to make the image shrink as the browser becomes smaller? I may have messed it all up when I messed with everything trying to figure it out…

And I’ll make sure to split the questions up next time. Sorry about that!

[jooservices Friend jooservicesJoin date: October 2014Posts: 8556Downloads:0Uploads:130 Thanked: 1245 times in 1121 posts]

#551186

Hi there,
As far i can understand your issue is. Image always align at center screen, no matter how size of monitor ?
I think i can try it on your live site. Please provide me some screenshot to make sure understand correctly your question. I’ll try to play around css on your site.
In case css can’t do, we still have javascript 😉

Thank you,
Viet Vu

[cmgaskell Friend cmgaskellJoin date: September 2014Posts: 36Downloads:0Uploads:17 Thanks: 14]

#551192

I see it perfectly on my screen here –

But on a smaller screen it doesn’t shrink –

And when I shrink the browser it moves the image off centered –

My solution was going to be just to embed the logo into the actual sl1-bg image and do without the effects, but Ideally I would want it to shrink appropriately.

Thanks again for your help, you guys are awesome!

---

Attachments:

1. 
2. 
3. 

[jooservices Friend jooservicesJoin date: October 2014Posts: 8556Downloads:0Uploads:130 Thanked: 1245 times in 1121 posts]

#551356

Hi there,
To make image be centered you should use width % instead specific px value.
As far i understand your question. You want to have logo be on screen center no matter how size of screen, isn’t it ?

Thank you,
Viet Vu

1 user says Thank You to jooservices for this useful post

1. cmgaskell

[cmgaskell Friend cmgaskellJoin date: September 2014Posts: 36Downloads:0Uploads:17 Thanks: 14]

#551432

I was trying to get the image to be proportional no matter the size of the screen (until it went super small like on a tablet). The image was showing up all over the place in a smaller laptop screen (15in). I just put embedded the logo in the sl1-bg image so it shrinks with the background. Thanks for your help though!

[jooservices Friend jooservicesJoin date: October 2014Posts: 8556Downloads:0Uploads:130 Thanked: 1245 times in 1121 posts]

#551448

Hi there, Good morning
I hope your issue have solved ? 🙂 If not please feel free to let us know.

Thank you,
Viet Vu

[Author]

Posts