WordPress.org

Support

Support » Themes and Templates » [Resolved] How to change the container size?

[Resolved] How to change the container size?

  • I need to change the container size (width) for my site, and I don’t know how!
    I looked in the CSS Stylesheet but I can’t find #container.
    I’ve read that I need to find #container and change the width.
    Can someone please tell me how to find the #container and change the container width?

    Also, I assume I would need to make room for the larger container? How do I move the side bars and widgets to make room for the larger container?
    There is plenty of empty room on the sides of the site.

    Thank you!!!

Viewing 6 replies - 1 through 6 (of 6 total)
  • Moderator Michael

    @alchymyth

    Forum Moderator

    the css id for your site might be different, as this will depend on your used theme;
    try to work with a web tool such as Firebug http://getfirebug.com/ to identify the involved css selctors.

    to get any help through this forum, please post a link to your site.

    Thanks!
    Here is a link to the site:
    http://www.culture-cross.org/creations/?wpsc-product=necklace
    notice how the text goes beyond the container. I think making the container larger will help. There is room for a larger container.

    How do I use Firebug to change the container size?

    Thank you!!

    Moderator Michael

    @alchymyth

    Forum Moderator

    Firebug is an analytic tool only, to help you to identify the involved css elements – changes need to be done in the style.css of your theme.

    you will need a basic to good knowledge of html and css.

    change the width of a few styles in style.css of your theme;
    the sections below show the increased width (increased by 150px):

    #wrap {
    	background: #FFFFFF;
    	width: 930px;
    	margin: 0px auto 0px;
    #header {
    	width: 830px;
    	height:120px;
    .splash { width:910px; padding:30px 30px 0; }
    #content {
    	width: 910px;
    	margin: 0px auto 0px;
    #contentleft {
    	float: left;
    	width: 650px;
    #footer {
    	width: 930px;
    	background: #eee;
    .footer {
    	width: 890px;
    	margin: 0px auto 0px;

    I DID IT!!!
    I got firebug and used the pointer thing that tells you whats what,
    then I just messed around with the width for each part that I found with firebug until it looked right.
    AWESOME
    thank you so much!

    Hi Guys – I’m having trouble getting Firebug to locate any code. I’ve loaded the web page and clicked on the ‘pointer thing’, but I’m nothing is happening. Any advice?

    Thanks in advance

    Moderator Andrew Nevins

    @anevins

    Forum moderator

    Create your own thread on the issue.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘[Resolved] How to change the container size?’ is closed to new replies.