Changing container sizes in Debut theme

• 

  shiningones · Member · Feb 3, 2013 at 5:24 pm

  • Copy link
  • Add topic to favorites

  Hi. I am using the debut theme. I try to change sizes of containers with CSS stylesheets. I used firebug to see the “references” but it don´t seem to work. This is my code:

  header-container {
  border-radius: 4px 4px 0 0;
  }
  #primary-nav {
  float: left;
  margin-left: -10px;
  padding: 10px 10px 0;
  }

  Is there something I am missing? Is there some special way to reference the objects in the CSS file from Debut????

  Thanks

  The blog I need help with is: (visible only to logged in users)

• 

  useyourname24 · Member · Feb 3, 2013 at 5:52 pm

  • Copy link

  if you are trying to change your container sizes you’ll need to look for the “id” or “class” of the container. id’s are reference with an # and classes with say “class” on the html page. lets say the header container is a class and is in fact called header-container as you stated. so in your css sheet you’d type…

  .container-head {
  width: px;
  height: px;
  (other properties you want to use)
  }

  sorry if this is no help but from what i read from your question this seemed to be a fix.

• 

  designsimply · Member · Feb 16, 2013 at 6:34 pm

  • Copy link

  Changing the width for Debut is a little more involved. Here is an example you can start with:

  #header-container,
  #main-container,
  #footer-container {
  	width: 1060px;
  }
  #header-above,
  #header-below,
  #hero,
  #main,
  #footbar-container,
  #footer,
  .section-layout {
  	width: 1040px;
  }
  
  #footbar {
  	width: 96%;
  }
  
  #hero .entry-background, #primary-nav li:hover, input#search-submit, .multiple .entry, #page-header-container {
  	width: 100%;
  }

  Note that the example above will stretch the slider images. There’s no way around that.