Joomla Templates Club 406,261 posts

[antonr Friend antonrJoin date: June 2011Posts: 27Downloads:0Uploads:0 Thanks: 12 Thanked: 2 times in 1 posts]

#165764

Hi guys,

I’ve modified JA Methys so that the site width is a total of 960px, and eliminated the slider bars to the left and right at the top of the site:

http://www.playershealthclub.com/beta/

What I need to do is keep the #ja-right image (dot.gi) that makes that whole side gray (F5F5F5/whitemsoke) to keep it aligned with the right edge of the site (30%). The code for it is below, but I can’t figure out what needs to be modified to keep the right rail a consistent size.

I’m sure it’s a modification of background-repeat-y: repeat

But not sure what needs to be there instead.

#ja-right
background: whiteSmoke url(http://www.playershealthclub.com/beta/templates/ja_methys/images/dot.gif) repeat-y 0% 0%;
background-image: url(http://www.playershealthclub.com/beta/templates/ja_methys/images/dot.gif);
background-repeat-x: no-repeat;
background-repeat-y: repeat;
background-attachment: initial;
background-position-x: 0%;
background-position-y: 0%;
background-origin: initial;
background-clip: initial;
background-color: whiteSmoke;

Let me know.

Thanks!
Anton

[John Wesley Brett Moderator John Wesley BrettJoin date: July 2013Posts: 2142Downloads:17Uploads:26 Thanks: 175 Thanked: 645 times in 426 posts]

#398937

As your CSS Compression is turned ON it is impossible to give you the specific CSS file and line number to change, but you are looking for:


#ja-container {
background: url("/ja_methys/templates/ja_methys/images/container-bg.gif") repeat-y scroll center top transparent;

}


Get rid of the above background statement and you get rid of the gray area to the right of your right module that is giving the appearance that your right module is fluid. In fact it is rigid and when you delete the above, or better yet, comment it out, you’ll see your right modules lining up perfectly.

If you have further issues, be sure to turn off the CSS Compression so we can better give you a specific remedy to your issue.

Have fun! and nice looking job so far!
John.

1 user says Thank You to John Wesley Brett for this useful post

1. antonr

[Sherlock Friend SherlockJoin date: September 2014Posts: 11453Downloads:0Uploads:88 Thanks: 221 Thanked: 2478 times in 2162 posts]

#398982

Hi antonr,

I’m not sure about your question, if jbrett can help you, that is best, if not, please explain more further your question, I will help you
Regards

1 user says Thank You to Sherlock for this useful post

1. antonr

[antonr Friend antonrJoin date: June 2011Posts: 27Downloads:0Uploads:0 Thanks: 12 Thanked: 2 times in 1 posts]

#399173

<em>@jbrett 250295 wrote:</em><blockquote>As your CSS Compression is turned ON it is impossible to give you the specific CSS file and line number to change, but you are looking for:


#ja-container {
background: url("/ja_methys/templates/ja_methys/images/container-bg.gif") repeat-y scroll center top transparent;

}


Get rid of the above background statement and you get rid of the gray area to the right of your right module that is giving the appearance that your right module is fluid. In fact it is rigid and when you delete the above, or better yet, comment it out, you’ll see your right modules lining up perfectly.

If you have further issues, be sure to turn off the CSS Compression so we can better give you a specific remedy to your issue.

Have fun! and nice looking job so far!
John.</blockquote>

Thanks, John.

I’ll look into this now. On top of juggling a major site redesign, I’m also having a helluva day dealing with SugarCRM and a cranky local network.

Some days I miss just playing sax for a living.

I’ll try your suggestion shortly.

Oh, I did find that I could edit the compressed css files and save them and make changes. That was something I didn’t know…although it seems T3 Cache Clear resets my css file names to different ones.

Again, thanks!
Anton

[antonr Friend antonrJoin date: June 2011Posts: 27Downloads:0Uploads:0 Thanks: 12 Thanked: 2 times in 1 posts]

#399191

Totally worked!

Turning off the CSS minify is helping streamline a lot of the changes I’m making…thanks for that tip.

So a new question has popped up: How do I keep all the 100% width container lines (1px gray horizontal lines) at the 980px size AND keep everything centered. I just tried modify the code:

.wrap
clear: both;
width: 980px <——————IT WAS 100%;

#ja-container.ja-r1
border-top: 1px solid #E5E5E5;
border-top-width: 1px;
border-top-style: solid;
border-top-color: #E5E5E5;
template.css:605
#ja-container
position: relative;
z-index: 5;
layout.css:15
.wrap
clear: both;
width: 100%;

…and it made the whole site justify weirdly to the left? I like it all centered.

Again, thanks for the help!

Anton on Hilton Head

1 user says Thank You to antonr for this useful post

1. lshube

[John Wesley Brett Moderator John Wesley BrettJoin date: July 2013Posts: 2142Downloads:17Uploads:26 Thanks: 175 Thanked: 645 times in 426 posts]

#399199

<em>@antonr 250606 wrote:</em><blockquote>How do I keep all the 100% width container lines (1px gray horizontal lines) at the 980px size AND keep everything centered. </blockquote>

You simply need to move the “border-top” attribute from the entire container…
[FONT=”Arial Black”]templates/ja_methys/css/template.css – Line 697[/FONT]


#ja-container.ja-r1 {
border-top: 1px solid #E5E5E5; <--- delete it here
}


…and add it to just the MAIN area of the container
[FONT=”Arial Black”]templates/ja_methys/css/template.css – Line 707[/FONT]


#ja-container .main {
background: none repeat scroll 0 0 #FFFFFF;
border-top: 1px solid #E5E5E5; <--- add it here
}


Since the line is directly beneath the slideshow, you might also want to add a touch of:

margin-top: 5px; to the MAIN to give it some breathing room and make it easier to see.

Same thing for the footer area:
Take it from template.css – line 999 and add it to line 1000

And for the NavHelper area… you will take it from line 865 and add it to line 867.

All you are doing is moving it from the general area to the MAIN area.

Magic! Have fun!
John.

2 users say Thank You to John Wesley Brett for this useful post

1. antonr
2. lshube

[antonr Friend antonrJoin date: June 2011Posts: 27Downloads:0Uploads:0 Thanks: 12 Thanked: 2 times in 1 posts]

#399391

John,

Thanks for the quick replies and help. Totally did the trick so far. I love this template, but it seems like by the time I’m finished, I’ll have created almost a new version of Methys.

All good! The support here has been terrific!

And…I’m sure I’ll have more questions before this site development wraps…it’s far and away my most complex site. Lots of moving parts.

Cheers,
Anton on Hilton Head

[John Wesley Brett Moderator John Wesley BrettJoin date: July 2013Posts: 2142Downloads:17Uploads:26 Thanks: 175 Thanked: 645 times in 426 posts]

#399392

Anton, you get it!
The template is but a “starting point” and you are doing a wonderful job.

Drop a note when you have another question, or when you complete!

John.

1 user says Thank You to John Wesley Brett for this useful post

1. antonr

[Author]

Posts