Viewing 15 posts - 1 through 15 (of 30 total)
  • Author
    Posts
  • TomC Moderator
    #156690

    I cannot figure out, for the life of me, how to reduce the width of ja-col1 (see image below)


    What I want is the left column to be the width I have it now, and the main content to fill the rest (with, perhaps, 8px or so padding between them.

    I’ve tried to modify the width value of ja-col1 – but it never works.

    HELP PLEASE !!!

    :((


    1. space
    gberm Friend
    #363841

    You can edit:

    YOUR-SITE-PATH/templates/ja_rutile/css/template.css
    line 559: Width of #ja-col1 (now is 28%)
    line 525: Width of #ja-content (now is 72%)

    The sum of 2 objects must be 100%, if you need a gap padding, please subtract from the width of one object.

    TomC Moderator
    #363930

    Appreciate the attempt to help, but none of what you offered worked at all.

    Now, of course, it’s all messed up.

    Feel free to take a look and, if you can figure it out, let me know –> http://www.musicians-marketplace.com

    Why do web designers operate under the assumption that anyone who might try to work with their templates will be rocket scientists ?? Honestly, things could be layed out a WHOLE LOT SIMPLER and with MUCH BETTER LOGIC than they are.

    >:(

    TomC Moderator
    #363934

    A supplemental related issue . . . . .

    If you click on “Layouts” and select “Content + Right Column,” you will see that the right column is not flush with the right side. So, this issue I am dealing with is affecting both the left AND right – and it all seems to have to do with the fluidity of the main content area.

    WHY DOES THIS HAVE TO BE SO DIFFICULT ???

    PLEASE HELP ME UNDERSTAND HOW TO WORK WITH THIS !!!

    :((

    Phill Moderator
    #363938

    Open template.css and around line 700


    div.module, div.module_text, div.module_menu, div.module_hilite, div.ja-box-br {
    background:url("../images/box-br.gif") no-repeat scroll right bottom #FFFFFF;
    clear:both;
    float:left;
    overflow:hidden;
    padding:0;
    width:80%;

    }

    The bit in red controls the width of the modules within that column. I assume you want the modules to fill that column and not have the gap. If so increase the width to 100%

    TomC Moderator
    #363940

    Okay, I believe understand that bit of logic … but then, how do I edit the CSS so that the main content section expands (width wise) to within 5px or so of the left column (on the Home Page) … AND/OR … so that if “Content + Right Column” is selected, the right column lines up against the right side border and the content expends to within 5px of the right column? (as described within my original post)

    Hope that makes sense.

    :((

    TomC Moderator
    #363944

    <em>@tcraw1010 204927 wrote:</em><blockquote>Okay, I believe understand that bit of logic … but then, how do I edit the CSS so that the main content section expands (width wise) to within 5px or so of the left column (on the Home Page) … AND/OR … so that if “Content + Right Column” is selected, the right column lines up against the right side border and the content expends to within 5px of the right column? (as described within my original post)

    Hope that makes sense.

    :((</blockquote>

    Nothing I have tried has worked (so far). I don’t understand this at all.

    Phill Moderator
    #363945

    Sorry, not quite sure what you want. Do you want smalle side columns and the content to be wider?

    TomC Moderator
    #363947

    <em>@phill luckhurst 204934 wrote:</em><blockquote>Sorry, not quite sure what you want. Do you want smalle side columns and the content to be wider?</blockquote>

    Yes, that’s exactly what I want – I want the content to be fluid with whatever width I choose for the right or left column.

    Trouble is, I cannot seem to get BOTH to work – I reduce the width of the left column, but the content doesn’t “stretch” to fill the gap. Do I need to change the width of BOTH the right and left columns concurrently for this to work?

    Phill Moderator
    #363948

    OK, now I understand. The percentage thing above is correct but you have to remember that this design used images for the background which is why it looks odd when you increase the width. If you want to increase the width you will also have to alter the background image.

    If you want fluid width for the main content then you will probably have to make the background a fixed colour rather than an image.

    TomC Moderator
    #363949

    Ahhhhhhhhhhh … but I also want the border/shadow look of the edges of the modules. How can I maintain that while changing backgrounds to solid colors? Pretty sure other templates are able to do this, right?

    The follow-up question would be WHY WHY WHY would the JA Developers of this template do it this way – thereby making the layout so stagnant versus flexible?

    :confused:

    Menalto Friend
    #363951

    Take a look in the template.css file for this here:
    Where you can see each and every width statement you can adjust to make the width suit your need.
    NOTE: If you change any width you need to edit the images that is used for the #ja-content div(three total).

    /* COLLAPSIBLE LAYOUT
    --------------------------------------------------------- */

    /*content + left*/
    #ja-containerwrap-fr #ja-col1 {
    width: 22%;
    }

    #ja-containerwrap-fr #ja-content {
    width: 78%;
    background: url(../images/content-center2.gif) repeat-y center;
    }

    /*content + right*/

    #ja-col2 {
    float:right;
    overflow:hidden;
    width:22%;
    }
    #ja-mainbody {
    float:left;
    width:78%;
    }

    /*full*/
    #ja-containerwrap-f #ja-content {
    background:url("../images/content-center1.gif") repeat-y scroll center center transparent;
    width:100%;
    }

    Phill Moderator
    #363953

    Blimey, where did you pop up from. Haven’t seen you on here in ages. Good to see you.

    TomC Moderator
    #363954

    So, if I am understanding correctly, the JA template designers for this template used fixed width images instead of a more fluid design? WHY would they do that?

    Phill Moderator
    #363956

    You will have to ask them. It was their choice. Seems to happen a lot with all template clubs.

Viewing 15 posts - 1 through 15 (of 30 total)

This topic contains 30 replies, has 5 voices, and was last updated by  TomC 13 years, 7 months ago.

We moved to new unified forum. Please post all new support queries in our New Forum