• I have inanis glass installed but i feel the content would be better if it was wider. I have a 22″ 16:10 screen and i see too much space between content and sidebar.

    How can i make it wider of fluid width?

Viewing 12 replies - 1 through 12 (of 12 total)
  • In the CSS – instead of references to width by pixels – change any to percentages. In that way the page will draw to that percentage of whatever size monitor or resolution a visitor uses.

    Thread Starter morlock

    (@morlock)

    Thank you Saurus, but I already knew it. I mean which CSS classes I need to modify.

    That depends on your theme and how the classes are named – which is why I said ANY reference to the width, change from pixels to percentage. The info you supplied in insufficient to give a better answer than that.

    Thread Starter morlock

    (@morlock)

    Sorry, i’m talking about inanis glass theme as you can see in the tags.

    What theme you use doesn’t matter. I’m certainly not about to download and install a theme to find it for you.

    Thread Starter morlock

    (@morlock)

    I didn’t request you to download this theme. I’m asking a question for the people who knows something about inanis theme. It’s not your case. Then, whatever you can say is useless.

    Ignorance is bliss …
    Sheesh.
    Again, IT DOESN’T MATTER WHAT THEME YOU’RE USING! CSS is CSS, Width in percentages doesn’t change depending on themes.

    sunny313

    (@sunny313)

    Thank you for the info Saurus, I am brand nw to this and you’ve answered the question very simply I was preparing to ask!

    Summer

    Saurus

    (@saurus)

    You are quite welcome. How refreshing to find someone who actually listens:)

    johnibanez

    (@johnibanez)

    Morlock, I suggest posting ur index.php and style.css before making posts like these. A lot of people use inanis but they wont remember specific classes and divs for the theme. usually, classes and div names are changed for customization purposes.

    Anyway in your case page, sidebar, content are most likely to be changed here.

    Hello,

    I have the same issue.

    I would like to make this theme fluid width.

    I really don’t have a clue what to change.

    Here is my index.php

    <?php get_header(); ?>
    <?php get_sidebar(); ?>
    <div id=”page”>
    <div id=”colwrap”>
    <?php include ‘banner.php’; ?>
    <!– Referrer Hints –>
    <?php
    if((function_exists(‘ls_getinfo’)) && (ls_getinfo(‘isref’))) { ?>
    <div class=”mission”>
    <h2><?php ls_getinfo(‘terms’); ?></h2>
    <p><?php _e(‘You came here from’,’inanis’);?>
    <?php ls_getinfo(‘referrer’); ?> <?php _e(‘searching for’,’inanis’);?> <i>
    <?php ls_getinfo(‘terms’); ?></i>. <?php _e(‘These posts might be of interest:’,’inanis’);?>
    </p>

      <?php ls_related(5, 10, ‘

    • ‘, ‘
    • ‘, ”, ”, false, false); ?>

    </div>
    <?php } else { ?>
    <?php } ?>

    <!– Posts –>
    <?php if (have_posts()) : ?>
    <?php while (have_posts()) : the_post(); ?>
    <div class=”postcont”>
    <div class=”alignright”>
    <div class=”PTtop”><img src=”<?php bloginfo(‘template_directory’); ?>/images/1pxtrans.gif” alt=” ” /></div>
    <div class=”PTbar”>
    <div class=”PTds Ptime”><span class=”ptblurl”> </span><span class=”blurt”><?php the_time(‘d M Y’) ?> @ <?php the_time(‘g:i A’) ?></span><span class=”ptblurr”> </span></div>
    <div class=”edt”><?php edit_post_link(‘edit’,'[ ‘,’ ] ‘); ?></div>
    <div class=”PT PTds”><span class=”ptblurl”> </span><h3>“><?php the_title(); ?></h3><span class=”ptblurr”> </span></div>
    </div>

    <div class=”PTbtm”><img src=”<?php bloginfo(‘template_directory’); ?>/images/1pxtrans.gif” alt=” ” /></div>
    <div class=”p1″>
    <div style=”overflow: auto”>
    <?php
    $content = get_the_content(__(‘More’,’inanis’).’ »’);
    $content = str_replace(‘<embed’, ‘<embed wmode=”transparent”‘, $content);
    $content = str_replace(‘</object>’, ‘<param name=”wmode” value=”transparent” /></object>’, $content);
    $content = apply_filters(‘the_content’, $content);
    echo $content;
    ?>
    </div>
    </div>

    <div class=”PFtop”><img src=”<?php bloginfo(‘template_directory’); ?>/images/1pxtrans.gif” alt=” ” /></div>
    <div class=”PFpst”>

    <span class=”spanchunk tagiconbox”>
    <img class=”tagicon” src=”<?php bloginfo(‘template_directory’); ?>/images/tags_50.png” alt=”Tags” />
    </span>
    <span class=”tagstyle spanchunk”>
    <?php the_tags(‘‘.__(‘Tags’,’inanis’).’: ‘, ‘, ‘, ‘
    ‘); ?>
    <?php _e(‘Categories’,’inanis’);?>: <?php the_category(‘, ‘) ?>
    </span>

    <span class=”tagstyle ts-sm spanchunk”>
    <?php _e(‘Posted By:’,’inanis’);?> <?php the_author() ?>
    <?php _e(‘Last Edit:’,’inanis’);?> <?php the_modified_date(‘d M Y’); ?> @ <?php the_modified_date(‘h i A’); ?>

    &body=<?php _e(‘I thought you might like this’,’inanis’); ?>: <?php the_permalink() ?>”><?php _e(‘Email’,’inanis’);?>
    ” rel=”bookmark” title=”<?php _e(‘Permanent Link to’,’inanis’);?> <?php the_title(); ?>”><?php _e(‘Permalink’,’inanis’) ?>
    <?php comments_popup_link(__(‘Comments’,’inanis’).’ (0)’, __(‘Comments’,’inanis’).’ (1)’, __(‘Comments’,’inanis’).’ (%)’); ?>
    </span>
    </div>
    <div class=”PFbtm”><img src=”<?php bloginfo(‘template_directory’); ?>/images/1pxtrans.gif” alt=” ” /></div>
    </div>

    </div>
    <hr class=”rule” />
    <?php endwhile; ?>

    <?php
    if(function_exists(‘pagination’)) {
    pagination(2,array(“Previous “,”Next”));
    } else { ?>
    <!–
    <div class=”navigation”>
    <div class=”alignleft”><?php next_posts_link(‘<img style=”vertical-align:middle;” src=”‘.get_bloginfo(‘template_directory’).’/images/arbk.png” alt=” ” /> ‘.__(‘Previous Entries’,’inanis’)) ?></div>
    <div class=”alignright”><?php previous_posts_link(__(‘Next Entries’,’inanis’).’ <img style=”vertical-align:middle;” src=”‘.get_bloginfo(‘template_directory’).’/images/arfw.png”>’) ?></div>
    </div></div>

    –>
    <div style=”float:right;width:660px;”>
    <div class=”navigation”>
    <div class=”alignleft”><?php next_posts_link(‘<img style=”vertical-align:middle;” src=”‘.get_bloginfo(‘template_directory’).’/images/arbk.png” alt=” ” /> ‘.__(‘Previous Entries’,’inanis’)) ?></div>
    <div class=”alignright”><?php previous_posts_link(__(‘Next Entries’,’inanis’).’ <img style=”vertical-align:middle;” src=”‘.get_bloginfo(‘template_directory’).’/images/arfw.png”>’) ?></div>
    </div>
    </div>

    <?php } ?>
    <?php else : ?>

    <div class=”bant”><img src=”<?php bloginfo(‘template_directory’); ?>/images/1pxtrans.gif” alt=” ” /></div>
    <div class=”banm”>
    <div class=”banner”>
    <h1><?php _e(‘Not Found’,’inanis’);?></h1>
    <p><?php _e(‘You seemed to have found a mislinked file, page, or search query with no results. If you feel you have reached this page in error, double check your search query and search again.’,’inanis’);?></p>
    <?php
    if(function_exists(‘UTW_ShowTagsForCurrentPost’)) { ?> <h2><?php _e(‘Browse by tag’,’inanis’);?></h2>
    <?php UTW_ShowWeightedTagSetAlphabetical(“coloredsizedtagcloud”,””,”120″) ?>
    <?php } ?> <h2><?php _e(‘Search’,’inanis’);?></h2>
    <?php include (TEMPLATEPATH . “/searchform.php”); ?>

    </div>
    </div>
    <div class=”banb”><img src=”<?php bloginfo(‘template_directory’); ?>/images/1pxtrans.gif” alt=” ” /></div>

    <?php endif; ?>
    <div style=”clear:right;”></div>
    </div>
    </div>

    <?php get_footer(); ?>

    and this is my stlye.css

    /*
    Theme Name:Inanis Glass
    Description:v1.3 – Glass-like theme for WP 2.6+. 2 col. fixed w/right sidebar, widget & multi-language ready, 7 reader selectable themes saved by cookie, and default sub-theme is admin selectable. Admin selectable picture. README FIRST!Created by Inanis.
    Author:Inanis
    Author URI:https://www.inanis.net/blog/
    Version:1.3
    Tags:black, blue, green, brown, orange, two-columns, fixed-width, right-sidebar, custom-colors, custom-header, theme-options, threaded-comments, sticky-post, microformats
    Translations:
    Translation assistance from Zarek Jenkinson <https://zarek.net84.net/&gt;.
    German (de_DE) by Zarek Jenkinson <https://zarek.net84.net/&gt;.
    */
    *{margin:0; padding:0; font-family:”Segoe UI”,”Lucida Grande”,”Franklin Gothic Medium”,”URW Gothic L”,Helvetica,sans-serif}
    html{height:100%; margin:0; padding:0}
    body{padding:0; BACKGROUND:#09151F url(images/bg.jpg) top left repeat-x; background-attachment:fixed; MARGIN:0px auto; FONT-SIZE:0.8em; COLOR:#999; height:100%; min-width:900px}
    blockquote{margin:8px; padding:13px 2px 2px 41px; border:1px #ddd dotted; background:#f7f7f7 url(images/right_quotes.png) no-repeat}
    A{COLOR:#bbb}
    A:hover{COLOR:#9BD}
    IMG{border:0px; padding:0; margin:0}
    hr{height:1px}
    #page{margin:0px 240px 0 0}
    .ctr{text-align:center}
    hr.rule{visibility:hidden; margin:0; padding:0}
    pre{margin:8px; border:1px #ddd dotted; background:#f7f7f7; padding:0 15px 0 0; font-family:”Consolas”,”Lucida Console”,”Courier New”,monospace; overflow:auto}
    code{border:1px #aaa dashed; background:#ddd; font-family:”Consolas”,”Lucida Console”,”Courier New”,monospace}
    address{margin:10px}
    cite{border:1px #ccc dotted; background:#eee}
    cite.fn{border:0; background:none; font-weight:bold}
    q{background:#f7f7f7 url(images/right_quotes_sm.png) no-repeat; padding-left:16px}
    h1, h2, h3, h4, h5, h6{font-weight:normal; line-height:1.2em; color:#006E12}
    h1{font-size:22px}
    h2{font-size:19px; letter-spacing:-1px; font-weight:bold}
    h3{font-size:16px; letter-spacing:-1px; font-weight:bold}
    h4.ie6{background:#fff; padding:5px}
    h4{font-size:14px; letter-spacing:-1px; font-weight:bold}
    h5, h6{font-size:11px; font-weight:bold}
    ul, ol{margin:3px 2px 3px 2em}

    /* Custom Stuff*/
    .mnusp{z-index:100; position:fixed; bottom:0; BACKGROUND:url(images/menu-bg.png); width:100%; min-width:900px; height:35px}
    .nav{background:transparent; display:inline; font-size:12px}
    .nav ul{margin:0; padding:0; line-height:30px}
    .nav LI{margin:5px 0 5px 0; margin-right:2px; display:block; float:left; BACKGROUND:url(images/menu-button.jpg) repeat-x 50% bottom}
    .nav LI A{cursor:default; color:#fff; display:block; float:left; text-decoration:none; width:71px; height:30px; text-align:center}
    .nav LI A:hover{color:#fff; BACKGROUND:url(images/menu-button.jpg); background-position:0 -60px}
    .nav li:hover{BACKGROUND:url(images/menu-button.jpg); background-position:0 -60px}

    .current_page_item_tb A{line-height:32px; padding:0 0 0 1px; margin:0 -1px -2px 0; color:#fff; BACKGROUND:url(images/menu-button.jpg); background-position:0 -30px}
    li.current_page_item_tb A:hover{BACKGROUND:url(images/menu-button.jpg); background-position:0 0px}

    .current_page_parent_tb A{line-height:32px; padding:0 0 0 1px; margin:0 -1px 0 0; color:#fff; BACKGROUND:url(images/menu-button.jpg); background-position:0 -30px}
    li.current_page_parent_tb A:hover{BACKGROUND:url(images/menu-button.jpg); background-position:0 0px}
    .current_page_ancestor_tb A{line-height:32px; padding:0 0 0 1px; margin:0 -1px 0 0; color:#fff; BACKGROUND:url(images/menu-button.jpg); background-position:0 -30px}
    li.current_page_ancestor_tb A:hover{BACKGROUND:url(images/menu-button.jpg); background-position:0 0px}
    .nvtl{cursor:default}
    .nvtl ul{margin:0; padding:0; line-height:30px}
    .nvtl LI{margin-right:2px; display:block; float:left; BACKGROUND:url(images/menu-orb.png) repeat-x bottom}
    .nvtl LI A{display:block; float:left; text-decoration:none; width:45px; height:35px; text-align:center}
    .nvtl LI A:hover{color:#fff; BACKGROUND:url(images/menu-orb.png); background-position:0 0px}
    .nvtl li:hover{BACKGROUND:url(images/menu-orb.png); background-position:0 0px}
    .nvtl span{visibility:hidden}
    #StartMenu{position:fixed; left:0px; bottom:30px; visibility:hidden; width:400px; height:261px}
    .SMTop{background:url(images/smt.png) repeat-x; height:35px}
    .SMMiddle{background:url(images/smm.png) repeat-y top; padding:0 12px 0 12px; height:222px; font-size:12px}
    .SMBottom{background:url(images/smb.png) repeat-x top; height:4px}
    .SMSep{margin:2px 0 2px 6px}
    .SMsub{position:absolute; top:35px; float:left; background:url(images/smlp.png); width:226px; height:191px; color:#282828; font-size:12px}
    .SMsub A{text-decoration:none}
    .SMsub A:link{color:#282828}
    .SMsub A:visited{color:#282828}
    .SMsub A:active{color:#282828}
    .SMsub A:hover{color:#282828; text-decoration:none; cursor:pointer}
    .SMsub ul{margin:4px 0 0 4px; list-style-type:none}
    .SMsub li{cursor:default; margin:0 0 2px 0; padding:2px; height:32px; width:214px}
    .SMsub li a{display:block}
    .SMsub li a:hover{text-decoration:none; cursor:default; background:transparent}
    .SMsub li:hover{background:url(images/smhvbg.png)}
    .SMsub li img{float:left; margin-right:5px}
    .SMsh{visibility:hidden}
    .SMSubDiv{margin:13px 8px 8px 14px}
    .SMap{overflow:auto; width:209px; height:148px; padding:0; margin:4px 0 0 4px}
    .SMap ul{margin:0; padding:0; list-style-type:none}
    .SMap li{margin:0; padding:0; width:191px; height:auto; border-bottom:1px #eee solid}
    .SMap li:hover{background:#D5EDF9}
    .SMap a{display:block}
    .SMap a:hover{text-decoration:none}

    .SMCats{overflow:auto; width:209px; height:148px; padding:0; margin:4px 0 0 4px}
    .SMCats ul{margin:0; padding:0; list-style-type:none}
    .SMCats li{margin:0; padding:0 0 0 6px; width:auto; height:auto}
    .SMCats li a:hover{background:#D5EDF9}
    .SMCats li a{border-bottom:1px #eee solid; margin-right:1px}
    .SMCats li:hover{background:none}
    /*.SMCats .cat-item a{display:inline}
    */
    .SMCats .cat-item a:hover{text-decoration:underline; cursor:pointer}

    .SMTags a:hover{background:#D4EEFC}
    .SMsgbhr{cursor:default; position:absolute; top:155px; left:0px; margin:0; padding:4px 9px 4px 9px}
    .SMsgb{cursor:default; position:absolute; font-weight:bold; top:164px; left:4px; width:213px; height:18px; padding:5px 0px 0px 5px}
    .SMsgb:hover{background:url(images/smhvsm.png)}
    .SMsgb img{vertical-align:text-top; margin-right:24px}
    .SMRight{float:right; width:140px; margin-top:28px}
    .SMAvatarB{position:absolute; top:30px; left:293px; width:61px; height:35px; background:url(images/smavt.png)}
    .SMAvatar{position:absolute; top:7px; margin-left:48px}
    #StartBaloon{visibility:hidden; color:#222; padding:8px; position:fixed; bottom:36px; left:8px; background:url(images/throbbg.png); width:117px; height:18px}
    #StartBaloon img{vertical-align:middle}
    .navf{}
    .navf ul{margin:0; padding:0; line-height:30px}
    .navf LI{margin:5px 0 5px 0; margin-right:2px; display:block; float:left; BACKGROUND:url(images/menu-feed.png) repeat-x 50% bottom}
    .navf LI A{display:block; float:left; text-decoration:none; width:24px; height:30px; text-align:center}
    .navf LI A:hover{color:#fff; BACKGROUND:url(images/menu-feed.png); background-position:0 -60px}
    .navf li:hover{BACKGROUND:url(images/menu-feed.png); background-position:0 -60px}
    .navf img{margin-top:7px}
    .menu-sep{BACKGROUND:url(images/menu-sep.png); margin:5px 3px 5px 3px; padding:0; width:10px; height:30px; float:left}
    .SMRtPoCom{cursor:default; BACKGROUND:url(images/SMRtPoCom.png); position:absolute; bottom:42px; left:248px; width:125px; height:33px; line-height:33px; padding:0 0 0 8px}
    .SMRtPoCom:hover{BACKGROUND:url(images/smrthovb.png); text-decoration:none; color:#fff}
    .SMRtDiv{position:absolute; bottom:79px; left:245px; width:140px; margin:0}
    .SMRtHov{display:block; width:125px; height:24px; margin:0 0 0 3px; padding:9px 0 0 8px; text-decoration:none}
    .SMRtHov:hover{BACKGROUND:url(images/smrthov.png); text-decoration:none; color:#fff; cursor:default}
    .SMAdmin{position:absolute; bottom:160px; left:245px; width:140px; margin:0}
    .SMRtPoComFl{color:#000; position:absolute; bottom:7px; left:379px; width:160px; margin:0; background:#F5F5F5 url(images/SMRtPoComFl.png) repeat-y; border:1px #BEBCC0 solid}
    .SMRtOptsFl{color:#000; position:absolute; top:40px; left:382px; width:140px; margin:0; background:url(images/SMRtPoComFl.png); border:1px #BEBCC0 solid}
    .SMRtFlHd{font-weight:bold; padding:0 0 0 30px}
    .SMRtFlOpt{list-style-type:none; margin:0; cursor:default}
    .SMRtFlOpt img{margin:0 6px 0 2px; vertical-align:middle}
    .SMRtFlOpt li{margin:1px 0 1px 0; padding:2px; height:18px; line-height:18px}
    .SMRtFlOpt li:hover{background:url(images/smrtflhov.png)}
    .SMRtFlOpt li a{display:block}
    .SMRtFlOptInd li{padding-left:28px}
    .switchbutton{width:16px; height:16px; float:left; padding:0; margin:0px 2px 0px 0px; border:1px #888 solid}
    .voidb{border:1px #F00 solid}
    .liload{position:absolute; bottom:7px; float:right; width:140px}
    .liload a:hover{cursor:default}
    .LogAdmin{}
    .LogAdmin span{visibility:hidden}
    .LogAdmin ul{margin:0; padding:0; line-height:24px}
    .LogAdmin li{display:block; float:left; height:24px; line-height:24px}
    .LogAdmin LI A{display:block; float:left; text-decoration:none; height:24px; text-align:center}
    .logout{font-size:1px; background:transparent url(images/logout.png) repeat-x bottom left; width:53px; height:24px}
    .logout:hover{background:transparent url(images/logout.png); background-position:0 -48px}
    .logout A{width:53px}
    .login{background:transparent url(images/login.png) repeat-x bottom left; width:52px}
    .login:hover{background:transparent url(images/login.png); background-position:0 -48px}
    .login A{width:52px}
    .loggedout{font-size:5px; background:transparent url(images/logged-out.png); width:53px}
    .loggedin{font-size:5px; background:transparent url(images/logged-in.png); width:52px}
    .opts{background:transparent url(images/smopts.png) repeat-x bottom left; width:24px}
    .opts:hover{background:transparent url(images/smopts.png); background-position:0 -48px}
    .opts A{width:24px}
    div.mhov{z-index:10; position:absolute; bottom:0; left:-200px; visibility:hidden; color:#000; padding:8px; font-size:11px; width:158px; height:112px; float:left; background:url(images/mhovbg.png)}
    .mhov a{color:#000}
    .mhov h4 a{color:#006E12; text-decoration:none}
    div.mframe{overflow:auto; width:158px; height:112px}
    .cpi a{color:red}
    .cpi li a{color:#000}
    .taginfo{float:left; width:400px}
    .tagstyle{width:300px; margin-right:15px; font-size:12px}
    .ts-sm{width:230px}
    .tagstyle A{text-decoration:none}
    .tagstyle A:link{color:#024}
    .tagstyle A:visited{color:#024}
    .tagstyle A:active{color:#046}
    .tagstyle A:hover{color:#046; text-decoration:underline}
    .tagicon{margin-left:20px; display:block; float:left; padding:2px 5px 3px 0px}
    .tagiconbox{width:70px; margin-right:5px}
    .spanchunk{display:table-cell; display:inline-block; vertical-align:top}
    .ptblurl{background:url(images/ptblurl.png) no-repeat; width:4px; display:table-cell; display:inline; display:inline-block; vertical-align:top}
    .ptblurr{background:url(images/ptblurr.png) no-repeat; width:4px; display:table-cell; display:inline; display:inline-block; vertical-align:top}
    #colwrap{margin:0px auto; width:660px; height:100%}
    .postcont{width:660px; margin-bottom:8px}
    .PTtop{height:11px; width:660px; background:url(images/tit.png) top left repeat-y}
    .PTbtm{height:5px; width:660px; background:transparent url(images/tib.png) top left repeat-y}
    .PTbar{color:#fff; width:660px; padding-bottom:5px; background:url(images/tim.png) top left repeat-y}
    .PT{width:420px; margin-left:15px}
    .PT h3{display:inline; background:url(images/ptblur.png); line-height:17px; color:#000; margin:0; font-size:13px; font-weight:normal; text-decoration:none; letter-spacing:0px}
    .PT h3 a{color:#000; text-decoration:none}
    .PT h3 a:hover{background:url(images/ptblur.png); text-shadow:#fff 0px 0px 10px}
    .PFtop{width:660px; height:8px; background:url(images/ft.png) top left repeat-y}
    .PFpst{padding:0 0 4px 0; width:660px; color:#000; min-height:62px; font-size:13px; background:url(images/fm.png) bottom left repeat-y}
    .PFbtm{width:660px; height:14px; background:url(images/fb.png) top left repeat-y}
    .PTds{text-shadow:#fff 0px 0px 5px}
    .p1{color:#000; width:610px; padding:1px 25px 1px 25px; font-size:13px; background:url(images/cbg.png) top left repeat-y}
    .p1 p{margin:0 0 10px 0; padding:0}
    .p1 A{text-decoration:none}
    .p1 A:link{color:#06C}
    .p1 A:visited{color:#06C}
    .p1 A:active{color:#046}
    .p1 A:hover{color:#046; text-decoration:underline}
    .edt{width:50px; float:right}
    .Ptime{float:right; margin-right:15px; color:#000; font-size:13px; text-shadow:#fff 0px 0px 5px}
    .blurt{background:url(images/ptblur.png)}
    .clock{float:right; color:#fff; height:30px; line-height:30px; padding:4px 7px 0 0}
    #header{CLEAR:both; WIDTH:900px; HEIGHT:150px}
    #bp{margin-left:20px; width:110px; height:110px}
    .bp{HEIGHT:150px; margin:2px 0 0 0}
    .bpt{MARGIN:0px auto; width:150px; height:19px; BACKGROUND:url(images/lt.png)}
    .bpm{MARGIN:0px auto; width:150px; height:110px; BACKGROUND:url(images/lm.png)}
    .bpb{MARGIN:0px auto; width:150px; height:21px; BACKGROUND:url(images/lb.png)}
    span.tagcloud a{text-decoration:none; line-height:150%; text-align:justify}
    .mission{MARGIN-BOTTOM:10px; TEXT-ALIGN:justify}
    .bant{background:url(images/bant.png) repeat-x; width:664px; height:14px}
    .banm{background:url(images/banm.png) repeat-y top; width:620px; padding:0 22px 0 22px; min-height:96px}
    .banb{background:url(images/banb.png) repeat-x top; height:17px; width:664px}
    .banner{color:#000}
    .banner h1{font-size:24px; color:#006E12; margin:0 0 15px 0}
    .banner a{color:#006E12; TEXT-DECORATION:underline}
    .banner a:hover{color:#006E12; TEXT-DECORATION:none}
    .blogicon{float:left; margin:0 8px 0 0}
    .blogdesc{font-size:11px; margin:0}
    .itcat ul{width:450px; list-style-type:none; margin:0px; padding:0px; color:#9BD}
    .itcat ul li{display:block; margin:0px !important; padding:2px 2px 2px 15px !important; float:left; width:128px}
    .itcat ul li a{background:url(images/ar-button.jpg) repeat-x top; margin:0px !important; padding:2px 2px 2px 15px !important; display:block; width:128px; text-decoration:none}
    .itcat ul li a:hover{background-position:0 -30px; color:#9BD; text-decoration:none}
    .itlate a, .itpop a, .itcat ul li a{color:#9BD; text-decoration:none}
    .itcat ul li a:hover{color:#FFF; text-decoration:none}
    .footer{margin-top:30px}
    .comments{background-image:url(images/Comments.png); background-repeat:no-repeat; font-size:11px; display:block; float:right}
    .comments a{font-size:12px; font-weight:bold; color:#999; text-decoration:none}
    .comments a:hover{text-decoration:none; color:#555}
    #comments{font-size:15px; color:#000}
    ol#commentlist li{margin:0; list-style-type:none}
    ol#commentlist p{line-height:1.2em; margin-bottom:5px}
    ol#commentlist{padding:6px; margin:0px 10px 10px 10px}
    ol#commentlist .comment-time{font-size:10px; color:#999}

    .odd{background:#f8f8f8}
    .even{background:#fff}

    ol.commentlist li{border:0; border-left:1px #ddd dotted; border-top:1px #bbb dotted; margin:0 0 0 15px; list-style-type:none}
    ol.commentlist p{line-height:1.2em; margin-bottom:5px}
    ol.commentlist{padding:6px; margin:0px 10px 10px 0px}
    ol.commentlist .comment-time{font-size:10px; color:#999}

    .commentbox{padding:6px; margin:0px 10px 10px 60px; border-bottom:1px #ddd solid}
    .greybox{background:#efefef}
    .avatar{float:left; margin:3px; background:#fff}
    .commentauthor{font-size:16px; color:#006E12}

    .navigation{border-left:1px #000 solid; border-right:1px #5E6A74 solid; width:600px; margin:5px 40px 5px 19px; padding:0px 10px 0px 10px; height:31px; line-height:31px; FONT-WEIGHT:normal; FONT-SIZE:11px; COLOR:#fff; BACKGROUND:url(images/bcs-bg.png)}
    .navigation A{COLOR:#fff; TEXT-DECORATION:none}
    .navigation A:visited{color:#fff}
    .navigation A:active{color:#fff}
    .navigation A:hover{color:#fff; text-decoration:none}
    .navigation h3{color:#fff; line-height:31px}

    .sidebar-top{background:url(images/sbt.png) repeat-x; height:17px}
    .sidebar-mid{background:url(images/sbm.png) repeat-y top; width:192px; padding:0 22px 0 22px}
    .sidebar-bottom{background:url(images/sbb.png) repeat-x top; height:17px; width:236px}
    #sidebar{padding:0 0 40px 0; MARGIN:0 auto; FLOAT:right; WIDTH:240px; COLOR:#888; background:url(images/sbgrad.png) repeat-y top; min-height:100%}
    #sidebar h3{padding:0 0 4px 8px; FONT-WEIGHT:normal; FONT-SIZE:18px; MARGIN:0px; COLOR:#9BD; BORDER-BOTTOM:#666 1px solid; LETTER-SPACING:-1px; text-decoration:none}
    #sidebar ul{margin:0 0 0 10px}
    #sidebar ul li{margin:0; padding:0; LIST-STYLE-TYPE:none}
    #sidebar ul li ul li{margin:0; LIST-STYLE-TYPE:disc}
    #sidebar P{padding:2px 0 2px 0; BACKGROUND:url(images/dotted.gif) repeat-x 50% bottom; MARGIN:0}
    #sidebar P A{padding:4px 0 8px 0; MARGIN:0; COLOR:#BBB; TEXT-DECORATION:none}
    #sidebar P A:hover{COLOR:#9BD; TEXT-DECORATION:none}

    .search{FLOAT:right; width:220px}
    .search P{padding:0; MARGIN:0; TEXT-ALIGN:right}
    INPUT.text{BORDER:#ccc 1px solid; BACKGROUND:#fff; MARGIN:0px; WIDTH:130px; COLOR:#777}
    INPUT.text:hover{BORDER:#666 1px solid}
    TEXTAREA.text{BORDER:#ccc 1px solid; BACKGROUND:#fff; WIDTH:90%; COLOR:#444; HEIGHT:150px}
    TEXTAREA.text:hover{BORDER:#bbb 1px solid; BACKGROUND:#fff; COLOR:#000}
    INPUT.field{BORDER:#ccc 1px solid; WIDTH:200px; COLOR:#444; BACKGROUND-COLOR:#fff}
    INPUT.field:hover{BORDER:#bbb 1px solid; BACKGROUND:#fff; COLOR:#444}
    INPUT.button{BORDER:#ccc 1px solid; FONT-WEIGHT:bold; FONT-SIZE:10px; BACKGROUND:#f4f4f4; COLOR:#555}
    .form-text{width:396px; border:1px #888 solid; margin-left:5px}
    .form-textarea{width:456px; height:216px; border:1px #888 solid; margin-left:5px}
    .form-file, .form-select{BORDER:#5b5b5b 1px solid; BACKGROUND:#eee; COLOR:#000}
    INPUT.form-submit{font-size:10px; BORDER:#666 1px solid; BACKGROUND:#eee; COLOR:#000}
    .search-form{margin:0; padding:0 0 16px 0; position:relative}
    #SMSearchForm{position:absolute; margin:0px; top:195px; left:0}
    .search-text{position:absolute; top:0px; left:0px; font-style:italic; font-size:12px; width:165px; height:20px; border:0; padding:4px 3px 0 3px; margin:0; BACKGROUND:url(images/search-input.png) repeat-x left bottom; COLOR:#575757}
    .search-submit{position:absolute; top:0px; left:171px; width:20px; height:24px; border:0; margin:0; BACKGROUND:url(images/search-button.png) repeat-x left bottom; cursor:pointer}
    .sm-search-text{position:absolute; top:0px; left:0px; font-style:italic; font-size:12px; width:200px; height:20px; border:0; padding:4px 3px 0 3px; margin:0; BACKGROUND:url(images/search-input.png) repeat-x left bottom; COLOR:#575757}
    .sm-search-submit{position:absolute; top:0px; left:206px; width:20px; height:24px; border:0; margin:0; BACKGROUND:url(images/search-button.png) repeat-x left bottom; cursor:pointer}
    .search-submit:hover{BACKGROUND:url(images/search-button.png); background-position:0 -48px}
    .sm-search-submit:hover{BACKGROUND:url(images/search-button.png); background-position:0 -48px}
    fieldset{margin:8px; padding:5px; border:1px solid #ddd}
    div.pagination{font-size:11px; color:#fff}
    div.pagination a{padding:2px 5px 2px 5px; margin:2px; background-color:#444; text-decoration:none; color:#fff}
    div.pagination a:hover, div.pagination a:active{background-color:#f70; color:#fff}
    div.pagination span.current{padding:2px 5px 2px 5px; margin:2px; font-weight:bold; background-color:#333; color:#fff}
    div.pagination span.disabled{padding:2px 5px 2px 5px; margin:2px; background-color:#444; color:#868686}
    .gallery{text-align:center; display:inline-block; width:100%}
    .gallery img{padding:2px; height:100px; width:100px}
    .gallery a:hover{background-color:#fff}
    .attachment{text-align:center}
    .attachment img{padding:2px; border:1px solid #999}
    .attachment a:hover{background-color:#FFF}
    .imgnav{text-align:center; clear:both}
    .imgleft{float:left}
    .imgleft a:hover{background-color:#FFF}
    .imgleft img{padding:2px; border:1px solid #999; height:100px; width:100px}
    .imgright{float:right}
    .imgright a:hover{background-color:#FFF}
    .imgright img{padding:2px; border:1px solid #999; height:100px; width:100px}
    .aligncenter, div.aligncenter{display:block; margin-left:auto; margin-right:auto}
    .alignleft{float:left}
    .alignright{float:right}

    Thanks for any help.

    Ben

    Hello Saurus

    I believe this is what I’m looking for. I use Atahualpa Theme and on my first monitor which is 22in – the site sellingourhome.com looks great, but when I open it up and any of my other two monitors (17 & 19in) the site it way too large the two smaller monitors are set at 1024 X 768.

    I though what you mentioned above might be able to help – but when I went to the CSS tab – the fields were empty. Any suggestions? Mark

Viewing 12 replies - 1 through 12 (of 12 total)
  • The topic ‘How do I make this theme fluid width’ is closed to new replies.