Joomla Templates Club 406,261 posts

[jsprague Friend jspragueJoin date: July 2007Posts: 62Downloads:0Uploads:5 Thanks: 14]

#123324

Please help e find where i can change the margins for this area…Thanks

[bluecafe Friend bluecafeJoin date: October 2006Posts: 157Downloads:0Uploads:0 Thanked: 2 times in 1 posts]

#231264

<em>@jsprague 30003 wrote:</em><blockquote>Please help e find where i can change the margins for this area…Thanks

</blockquote>

I guess it’s #ja-content

#ja-content {
padding: 25px 10px 10px 20px;
margin: 0;
clear: both;
display: block;
}

You could increase padding left, i.e. the last value 20px to anything higher.

[jsprague Friend jspragueJoin date: July 2007Posts: 62Downloads:0Uploads:5 Thanks: 14]

#231268

Perfect! I actually had to decrease it to 10 to get it to move left. Any chance you could help me figure out how to move the main content area to the right now just a bit…What we did with the above fix was to move the module area to the left but if you see in this image the content area is too far left… Also if you look at the JA demo the top mod and the content below are in alignment.

Thanks

[bluecafe Friend bluecafeJoin date: October 2006Posts: 157Downloads:0Uploads:0 Thanked: 2 times in 1 posts]

#231269

Hi .. this should be the same #ja-content. This time it is the second number of the padding value.
The order of the numbers regarding the padding values is: top – right – bottom – left

So this time it should be the second number that has to be in .. pardon decreased. 🙂

[jsprague Friend jspragueJoin date: July 2007Posts: 62Downloads:0Uploads:5 Thanks: 14]

#231270

I really really appreciate your help! That said, I have changed those values many time bu i can get the main content text to line up with the left edge of the module behind it… if you look at the demo it shows the slider module lined up with the text below it. When I change the values suggested it just seems to move them both. Any other ideas?

Thanks again

[bluecafe Friend bluecafeJoin date: October 2006Posts: 157Downloads:0Uploads:0 Thanked: 2 times in 1 posts]

#231276

sorry, jsprague … I should have read your post more carefully before answering.
Actually the module and the text should line up. Which module are you using?
Maybe you need to modify the css file of the module in order to move it a bit more left.

The (text)content is dependent on the #ja-content padding. So if both, module and
text, do not line up I think it is most likely the css file of the module that adds a few extra pixels
padding or margin …

[jsprague Friend jspragueJoin date: July 2007Posts: 62Downloads:0Uploads:5 Thanks: 14]

#231280

Again I thank you for your time. It the images below you can see a shot of the JA demo and one of mine… I tried the default banner module that comes with the Joomla install and you can see the module on my sit and the one on the JA site are bothh aligned to the left edge of the home button. Notice though that the text below mine is pushed to the left but the text on the JA shot is aligned perfectly with the slider module above it.

Any other ideas would be great!

Thanks

[bluecafe Friend bluecafeJoin date: October 2006Posts: 157Downloads:0Uploads:0 Thanked: 2 times in 1 posts]

#231285

That is because the border of the banner is not the actual module border but a border of the image that has a white margin around.

The hedera content slider of the demo has a border that doesn’t show up if you install the downloaded content slider because they have made a little error in the xml file of the module thus the border images won’t be installed. You have to copy them manually into the mod_ja_contentslide folder. These are the images corner-bl.gif, corner-br.gif, corner-tr.gif, corner-tl.gif. They are contained in the zip but won’t be installed correctly because they are not listed in the xml-file. Without the border images it looks as if there was an additional padding around.

If you have copied these images in the mod_ja_contentslide folder you will have a border that lines up with the text like in the demo even if you have reduced the padding.

Out of curiosity I tried it out in a local installation and couldn’t succeed by reducing the padding.
However, I could reduce the left margin by adding a negative margin-value:

#ja-content {
padding: 25px 10px 10px 25px;
margin: 0 0 0 -10px;
clear: both;
display: block;
}

and everything lines up perfectly

[jsprague Friend jspragueJoin date: July 2007Posts: 62Downloads:0Uploads:5 Thanks: 14]

#231351

thanks again… Ok am I correct in assuming that unless i use the slider component from the demo, my content text and my modules will not line up? I have tried several other modules and they all appear to have an invisible border… when i adjust the padding it just moves everything over in cluding the main body content… isnt there a way to only move the content to the right a bit leaving the module where it is?

Thanks,
Josh

[bluecafe Friend bluecafeJoin date: October 2006Posts: 157Downloads:0Uploads:0 Thanked: 2 times in 1 posts]

#231356

Hi, the difference between the contentslider and the other modules is that the slider has a border thus it lines up with the text. If you change your moduletable settings in the css file and give the modules a border, for example:

div.moduletable {
padding: 0 10px 10px;
margin-bottom: 30px;
border: 1px solid #ccc;
}


Then all your modules will have a border and line up with your text, like in this example

There you can see that the module itself lines up with the text, but it is the module border not the module content that lines up. So if you give the modules a visible border you shouldn’t have any white spaces anymore.

Another option is to remove the 10px padding in the css settings for moduletable

div.moduletable {
padding: 0 10px 10px 0px;
margin-bottom: 30px;
}


This way you are removing the 10px padding left that come with the modules.

[jsprague Friend jspragueJoin date: July 2007Posts: 62Downloads:0Uploads:5 Thanks: 14]

#231358

Thanks for the excellent help, but if you look at my site you can see that the border worked for the left align problem but has since put a border around them all 🙂
http://www.coremountainsports.com/

[bluecafe Friend bluecafeJoin date: October 2006Posts: 157Downloads:0Uploads:0 Thanked: 2 times in 1 posts]

#231359

ok … then try the second option and add padding-left value of zero to your moduletable css commands.

The order of the padding value is top – right – bottom – left … so you need to add 0px as value for padding-left to your module table settings. Then delete the border since it is not needed anymore and your module should line up quite well … and you won’t have borders around all your modules.

Problem is that then all other modules won’t have any left padding even those in the columns and this might not look too well.

Can you add a specific module class suffix in the paramters of your gallery module? Many modules have this option:

Then you could use the padding-left = zero only for this specific module class, for example give your module a class -left

then add in your css-file:

div.moduletable-left {
padding: 0 10px 10px 0px;
margin-bottom: 30px;
}

and only those modules that have a left-class in their parameters will have zero padding left and all the others are displayed with ‘normal’ padding.

[jsprague Friend jspragueJoin date: July 2007Posts: 62Downloads:0Uploads:5 Thanks: 14]

#231360

Oh MAN! That last option did the trick! I really cant thank you enough!

[Author]

Posts