Joomla Templates Club 406,261 posts

[douglas Friend douglasJoin date: March 2006Posts: 42Downloads:0Uploads:1]

#118022

Question about changing wrapper width in Ja-Spica, or Right column width to accommodate wrapper so it fits?

I have an external content item (an Amazon Store feed) in a wrapper that doesn’t quite fit on the page as the right side of the wrapper item gets chopped off when I have the right column item visible. I need the right column, but how can I modify the size of the:

1. Wrapper item so it fits properly. If I could adjust some of the white space being used on the left side of the wrapper, then perhaps it would fit. Where can I adjust the wrapper padding?

2. The module items on the right do not need to be that wide, so how can I adjust the right column width for the right column modules, so the wrapper has more space?

Am I looking in the right location in the /templates/ja_spica/css/template_css.css?

What can I modify here to make the wrapper fit properly so I doesn’t get chopped off. It’s about 30 pixels short to fit properly so nothing gets chopped off on the right hand side of the wrapper.

Any help or suggestions appreciated!!!!! Doug

/* MAIN CONTAINER
——————————————————— */

#ja-wrapper {
width: 100%;
color: #000000;
}

#ja-container {
width: 770px;
text-align: left;
padding: 0;
margin: 0 auto;
border-right: 2px solid #3C3C3C;
border-left: 2px solid #3C3C3C;
}

#ja-container-shadow1 {
border: 2px solid #383838;
}

#ja-container-shadow2 {
border: 3px solid #2C2C2C;
background: #FFFFFF;
line-height: 18px;
}

/* 2 columns content width */
#ja-content {
margin: 0 15px 0!important;
margin: 0 8px;
width: 565px;
float: left;
}

/* 1 column content width */
#ja-content-full {
margin: 0 15px 0;
width: 730px;
}

/* PATHWAY
——————————————————— */

#pathway {
color: #FFFFFF;
background: #FFFFFF;
font-size: 0;
line-height: normal;
padding: 5px 0 2px 2px;
}

#pathway a {
padding: 0 15px 0 0;
color: #666666;
background: url(../images/arrow-off.gif) no-repeat center right;
font-size: 11px!important;
}

#pathway a:hover, #pathway a:active {
background: url(../images/arrow-on.gif) no-repeat center right;
}

#pathway img {
visibility: hidden;
}

/* RIGHT COLUMN
——————————————————— */

#ja-rightcol {
width: 160px;
float: right;
border-right: 5px solid #FFFFFF;
}

#ja-rightcol a.mainlevel {
padding-left: 20px;
background: url(../images/arrow-off.gif) no-repeat 5px 4px;
}

#ja-rightcol a.mainlevel:hover, a.mainlevel:active {
background: url(../images/arrow-on.gif) no-repeat 5px 4px;
}

#ja-rightcol a.sublevel {
padding-left: 3px;
}

[Khanh Le Moderator Khanh LeJoin date: November 2013Posts: 1884Downloads:41Uploads:31 Thanks: 44 Thanked: 203 times in 131 posts]

#212651

You could ajust the width of #ja-content and #ja-rightcol.

[Author]

Posts