• Hello,

    i have created a custom page for my blog. I removed the right sidebar from this page and now I want to increase the center text area width, but that’s where I got stuck.

    This is the page I’m talking about (site is in dutch):http://www.inner-challenge.be/boeken-dvds/engelstalig/

    I would like to have a left sidebar and a text area (width= original textarea+sidebar=750px). As you can see, the text also jumps to the left where the left sidebar finishes. I have no idea how to fix this, so every help is very much appreciated!

    i copied the ‘entry’-part which controls the center text area and created a copy named ‘custom’ in the css-file. I changed the <div class=”entry”> into <div class=”custom”> in the php page, but no success so far. My php and css knowledge is very limited, maybe you guys can help me out.

    This is my css file:
    /*
    Theme Name: Rhea
    Theme URI: http://www.blogohblog.com
    Description: A professional wordpress theme and totally free for your use. Take it, Break it..Its urs!!
    Version: 1.0
    Author: Jai Nischal Verma
    Author URI: http://www.blogohblog.com
    */

    /**************** Body *********************/
    * { margin:0; padding:0;}
    body { font-size: 9pt; font-family: Arial,sans-serif; color: #333; line-height: 140%; background:#FFFFFF; }
    #wrapper { margin: 20px auto; padding: 0px; width: 1010px; background: #fff url(images/wrapper_top.gif) no-repeat top; }
    #top { margin: 0px auto; padding: 00px 0 0 0; width:1008px; height: 137px; }

    /**************** Header *********************/
    #header {margin:0;padding:0; width:1008px;}
    #header h1 {text-indent:-10000px;margin:0;padding:0;}
    #header h1 a {display:block;background:url(images/kop42.jpg) no-repeat left;height:137px;}

    /**************** Navigation *********************/
    #navbar { margin: 0px auto; padding: 0px; width:1008px; height: 31px; background: url(images/navbar3.gif) no-repeat;}
    #menu {margin: 0px; padding: 0px; float: left; width: 500px; height:31px;line-height:31px;}
    ul.menu{float:left;list-style:none;font-size:12px;font-weight:normal;margin:0 0 0 5px;padding:0;}
    ul.menu li{float:left !important;list-style-type:none;margin:0;padding:0;}
    ul.menu li a,ul.menu li a:link,ul.menu li a:visited{border-bottom:0;border-left:0;color:#333;float:left;display:block;text-decoration:none;padding:0 5px;}
    ul.menu li a:hover,ul.menu li a:active{background:#fff;color:#555;text-decoration:none; color:#336699;}
    ul.menu li.home a{border-left:2px solid #fff;text-decoration:none;}
    ul.menu li ul{float:left;margin:0;padding:0;}

    /**************** Search *********************/
    #searchrss { margin: 0px; padding: 0px; float: right; width: 420px; text-align:right; }

    #rss a,#rss a:link, #rss a:visited { color:#333; text-decoration: none; padding:0;}
    #rss a:hover { color: #0e4761; text-decoration: none; padding:0;}
    #topsearch { float:right; width: 230px; height: 22px; font-size:8pt; background: url(images/bg_search_box.gif) no-repeat; margin:5px 0 0 0; }
    #topsearch #ls { float: left; padding: 0; margin: 3px 0 0 6px; border: 0; width: 145px; font-size:8pt; background: none; }
    #topsearch #go { float: right; margin: 0 6px 0 0; }

    /**************** Content *********************/
    #main { margin: 0px auto; padding: 10px 0 0 0; width:1008px; background:url(images/mainbkg2.gif) repeat-y;}
    #content { margin: 0px; padding: 0px; float: left; width: 735px;}

    /**************** Themes *********************/
    #lsidebar { margin: 0px; padding: 0px; float: left; width: 235px; }
    .lsidebar { margin:0; padding:0;float: left; width: 210px; }
    .lsidebar a, .sidebar h2 a:visited{ color: #666; text-decoration: none; font-weight:bold; }
    .lsidebar a:hover{ text-decoration: none; color: #6B90A2; }
    .lsidebar ul{ list-style-type: none; margin: 0; padding: 0;}
    .lsidebar ul li{ margin: 0 0 20px; }
    .lsidebar ul li h2{ padding:5px; font-size:14px; color: #FFFFFF; background:url(images/lsidebarh22.gif) no-repeat;}
    .lsidebar ul ul{ padding: 4px 11px 11px; background: #EAEAEA url(images/sidebar-bottom.gif) no-repeat bottom; }
    .lsidebar ul ul li{ margin: 0; padding: 0 0 0 16px; line-height: 22px; border-bottom:2px solid #fff; background: url(images/bullet5.gif) no-repeat 0px 5px; }
    .lsidebar ul ul li.quicksms{ margin: 0; padding:0; line-height: 22px; background:none;}
    .lsidebar ul ul ul{ border: 0; padding: 0; background-image: none; }
    .lsidebar ul ul ul li{ padding: 0 0 0 10px; background-image: none; }

    /**************** Entry *********************/

    .entry { margin: 0px; padding: 0px; float: right; width: 500px; }
    .entry a, .entry a:link { color:#444444; text-decoration: none; padding:0; border-bottom:1px dotted #ED145A; font-weight:bold;}
    .entry a:hover, .entry a:visited { color: #444444; text-decoration: none; padding:0;}
    .entry h2 { font-size:17px; margin:0; padding:0 0 5px 0;}
    .entry p {margin:0; padding:0 0 10px 0;}
    html>body .entry ul { margin-left: 0px; padding: 0 0 0 30px; list-style: none; padding-left: 10px; text-indent: -10px; }
    html>body .entry li { margin: 7px 0 8px 10px; }
    .entry ul li:before{ content: “0BB 020”; }
    .entry ol { padding: 0 0 0 35px; margin: 0; }
    .entry ol li { margin: 0; padding: 0; }
    .line { background:url(images/dot.gif) repeat-x; margin:10px 0 0 0; padding:0 0 20px 0; }

    /**************** custom *********************/

    .custom { margin: 0px; padding: 0px; align: right; width: 750px; }
    .custom a, .custom a:link { color:#444444; text-decoration: none; padding:0; border-bottom:1px dotted #ED145A; font-weight:bold;}
    .custom a:hover, .custom a:visited { color: #444444; text-decoration: none; padding:0;}
    .custom h2 { font-size:17px; margin:0; padding:0 0 5px 0;}
    .custom p {margin:0; padding:0 0 10px 0;}
    html>body .custom ul { margin-left: 0px; padding: 0 0 0 30px; list-style: none; padding-left: 10px; text-indent: -10px; }
    html>body .custom li { margin: 7px 0 8px 10px; }
    .custom ul li:before{ content: “0BB 020”; }
    .custom ol { padding: 0 0 0 35px; margin: 0; }
    .custom ol li { margin: 0; padding: 0; }
    .line { background:url(images/dot.gif) repeat-x; margin:10px 0 0 0; padding:0 0 20px 0; }

    /**************** Misc *********************/
    acronym, abbr, span.caps { cursor: help; }
    acronym, abbr { border-bottom: 1px dashed #999; }
    blockquote { margin: 15px 30px 0 10px; padding-left: 20px; border-left: 5px solid #ddd; }
    blockquote cite { margin: 5px 0 0; display: block; }
    .center { text-align: center; }
    hr { display: none; }
    a img { border: none; }
    .navigation { display: block; text-align: center; margin-top: 10px; margin-bottom: 60px; }

    img.centered{display:block;margin-left:auto;margin-right:auto;}
    img.alignright{display:inline;margin:0 0 2px 7px;padding:4px;}
    img.alignleft{display:inline;margin:0 7px 2px 0;padding:4px;}
    pre {border: solid 1px #9a9a9a;
    white-space: pre-wrap; /* css-3 */
    white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */
    white-space: -pre-wrap; /* Opera 4-6 */
    white-space: -o-pre-wrap; /* Opera 7 */
    word-wrap: break-word; /* Internet Explorer 5.5+ */
    font-size: 1.3 em;
    color: blue;
    margin: 10px;
    padding:10px;
    background: #f3f2ed}
    code {font-size:1.0em;color: #000}

    /**************** Comments *********************/
    #commentsbox { margin: 0px; padding: 0px; float: left; width: 500px; font-size:11px;}
    #comments h2{margin:10px 0 0 0; padding:0; color:#ff5c00; font-size:14px; font-weight:normal;}
    h3 #respond {margin:10px 0 0 0; padding:0; color:#ff5c00; font-size:14px; font-weight:normal;}
    .boxcomments{margin-bottom:20px;width:500px;}
    #commentform{border-top:1px solid #eee;margin:0;padding:15px 15px 1px;}
    #commentform label{display:block;margin:0;}
    #commentform input{width:170px;margin:0 5px 10px 0;padding:1px;}
    #commentform textarea{width:400px;margin:0 0 10px;padding:0;}
    #commentform #submit{margin:0 0 20px;}
    #commentform p{margin:5px 0; }
    ol.commentlist{margin:0 0 1px;padding:0;}
    ol.commentlist li{border-bottom:20px solid #fff;display:block;list-style:none;margin:0;padding:5px 15px 1px; background:#f2f8ff;}
    ol.commentlist li.mycomment{border-bottom:20px solid #fff;display:block;list-style:none;margin:0;padding:5px 15px 1px; background:#f3fdff;}
    ol.commentlist li.commenthead{display:block;list-style:none;margin:0;padding:5px 15px;}
    ol.tblist{list-style:none;margin:0 0 1px;padding:0;}
    ol.tblist li{display:block;list-style:none;padding:10px 5px 10px 5px;margin:0 0 5px; border:1px dashed #ccc;}
    input#url,input#author,input#email,textarea{color:#666;width:40%;border:1px solid #cbcbcb;margin-bottom:0.6em;background:#fcfcfc;margin-top:2px;padding:3px;}

    /**************** Sidebar *********************/
    #sidebar { margin: 0px; padding: 0px; float: right; width: 250px; }
    .rsidebar { margin:0; padding:0;float: right; width: 250px; }
    .rsidebar a, .sidebar h2 a:visited{ color: #666; text-decoration: none; font-weight:bold; }
    .rsidebar a:hover{ text-decoration: none; color: #6B90A2; }
    .rsidebar ul{ list-style-type: none; margin: 0; padding: 0;}
    .rsidebar ul li{ margin: 0 0 20px; }
    .rsidebar ul li h2{ padding:5px; font-size:14px; color: #FFFFFF; background:url(images/sidebarh3.gif) no-repeat;}
    .rsidebar ul ul{ padding: 4px 11px 11px; background: #EAEAEA url(images/sidebar-bottom.gif) no-repeat bottom; }
    .rsidebar ul ul li{ margin: 0; padding: 0 0 0 16px; line-height: 22px; border-bottom:2px solid #fff; background: url(images/bullet5.gif) no-repeat 0px 5px; }
    .rsidebar ul ul li.quicksms{ margin: 0; padding:0; line-height: 22px; background:none;}
    .rsidebar ul ul ul{ border: 0; padding: 0; background-image: none; }
    .rsidebar ul ul ul li{ padding: 0 0 0 10px;; background-image: none; }

    /**************** Footer *********************/
    #footer { margin: 0px auto; padding: 0px; width:1008px; height: 31px; line-height:31px; background: url(images/navbar.gif) no-repeat; clear:both }
    #footer a,#footer a:link,#footer li a:visited{border-bottom:0;color:#333;text-decoration:none;}
    #footer a:hover,#footer a:active{color:#000;text-decoration:none;}
    .footer{ margin:0; padding:0 0 0 10px; float:left;}
    .top{ margin:0; padding:0 10px 0 0; float:right;}
    #wrapper_ { margin: -20px auto; padding: 0 0 20px 0; width: 964px; height:20px; background:transparent url(images/wrapper_bottom2.gif) no-repeat top; }

    /*.widget_nextgenimage h2 { display:none;}*/
    .ngg-widget { text-align:center; padding: 4px 11px 10px 11px; background: #ECF6FA url(images/sidebar-bottom.gif) no-repeat bottom; line-height:150%;}

Viewing 1 replies (of 1 total)
  • hi

    For starters, make this change to your CSS
    line 74 in style.css

    .custom {
    CHANGE -->  margin:0 0 0 210px;
    padding:0;
    width:750px;
    }

    That will do most of, and maybe all of, what you want to do.

Viewing 1 replies (of 1 total)
  • The topic ‘How to widen text area on custom page?’ is closed to new replies.