WordPress.org

Ready to get started?Download WordPress

Forums

Want to reduce size of sidebar (4 posts)

  1. Jasmine Malik
    Member
    Posted 7 months ago #

    Hi. I want to reduce the size sidebar. I've two sidebar on my website and I wanna increase the area of posting. I've read posts about about it but I'm having a problem because I think my theme html is different from others.

    This is my site. http://fun4smile.com/

    and this is the codes of sidebar in my style css

    backticks

    /* sidebar styles */

    .sidebar{
    padding:0;
    font-size:100%;
    }

    .sidebar a{
    font-weight: 100;
    }

    .sidebar a:hover{
    text-decoration:none;
    }

    .sidebar ul{
    margin:0;
    padding:0;
    list-style-type:none;
    }

    .sidebar ul li.widget{
    padding:2px 0px 4px 0px;
    margin:0 0 12px 0px;
    }

    .sidebar ul li.widget ul{
    margin: 0;
    padding:0;
    }

    .sidebar ul li.widget ul li{
    background: none;
    padding: 0px 2px 2px 7px;
    margin:0 1px;
    border-bottom: 1px solid #eee;
    }

    .sidebar ul li.widget ul li ul li{
    border-bottom: none !important;
    padding: 2px 2px 0 10px;
    }

    .sidebar ul li.widget h3{
    font-size:140%;
    padding:0px 0 1px 7px;
    margin:0;
    color: #333;
    font-weight: 100;
    border-bottom: 4px solid #ccc;
    }
    .sidebar ul li h3 a{
    color: #333;
    font-weight: 100;
    }
    .sidebar ul li h3 a:hover{
    color: #555;
    text-decoration: none;
    }

    li.widget .textwidget, li.widget #search, li.widget_tag_cloud div{
    padding: 2px 6px;
    }

    backticks

    Please let me know.

  2. RachelGoldstein71
    Member
    Posted 7 months ago #

    It looks like your left sidebar is controller by #primary, your content area is #content, and your right sidebar is #secondary. Look for those in your CSS.

  3. Jasmine Malik
    Member
    Posted 7 months ago #

    Yes. This is here.

    #content {
    width: 140%;
    }
    
    #primary {
    	width: 180px;          /* LC width */
    	right: 240px;          /* LC width */
    	margin-left: -100%;
    	}
    #secondary {
    	width: 180px;          /* RC width */
    	margin-right: -240px;  /* RC width */
    	margin-left: 20px;
    	}

    Now . how should i do this ?

  4. RachelGoldstein71
    Member
    Posted 7 months ago #

    You can play with it by changing the values in Chrome's "Inspect Element" (right click the column, then Inspect Element). Or use Firefox add-on called Firebug. I think it will take some trial and error to get it right.

Reply

You must log in to post.

About this Topic