title: There is something wrong with my css of full calendar. Width auto is not responding
body: <p>I'm using Full Calendar to show some events dates but having problem with widht value. I want it to be able to work properly at minimum 1024x768 resolution and other bigger screen sizes ( such as 1366x768 sized )  I tried quoting every width value in fullcalendar.css, enabling, disabling all css files one by one, inserting inline styles. Somebody advised working with bootstap responsive but it didn't gone well either. Right now i can see my calendar perfect in 1024x768 resolution but in  bigger resolutions there is a gap between calendar and right tables. I used chrome's tool inspect element and it says there is nothing on that empty area such as margin or padding.</p>
  
  <p>my header is:</p>
  
  <pre><code>    &lt;head&gt;
      &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
         &lt;!-- CSS FILES --&gt;
      &lt;!--[if !IE]&gt;&lt;!--&gt;
          &lt;link rel="stylesheet" href="/assets/default/css/style.css" type="text/css" /&gt;
      &lt;!--&lt;![endif]--&gt;
      &lt;!--[if IE]&gt;
          &lt;link rel="stylesheet" type="text/css" href="/assets/default/css/all-ie-only.css" /&gt;
      &lt;![endif]--&gt;
      &lt;link rel="stylesheet" href="/assets/default/css/bootstrap.min.css" type="text/css" /&gt;
      &lt;link rel="stylesheet" href="/assets/default/css/bootstrap-responsive.css" type="text/css" /&gt;
      &lt;link rel="stylesheet" href="/assets/default/scripts/jquery-ui-1.9.2.custom/css/smoothness/jquery-ui-1.9.2.custom.min.css" type="text/css" /&gt;
      &lt;link rel="stylesheet" href="/assets/default/css/fullcalendar.css" type="text/css" /&gt;
      &lt;link rel="stylesheet" href="/assets/default/css/fullcalendar.print.css" type="text/css" /&gt;
      &lt;link href="assets/default/css/bootstrap-responsive.css" rel="stylesheet"&gt;
      &lt;!-- END CSS FILES --&gt;
  
      &lt;!-- JS FILES --&gt;
      &lt;script src="/assets/default/scripts/jquery-1.8.3.min.js" type="text/javascript" &gt;&lt;/script&gt;
      &lt;script src="/assets/default/scripts/jquery-ui-1.9.2.custom/js/jquery-ui-1.9.2.custom.min.js" type="text/javascript" &gt;&lt;/script&gt;
      &lt;script src="/assets/default/scripts/bootstrap.min.js" type="text/javascript" &gt;&lt;/script&gt;
      &lt;script src="/assets/default/scripts/fullcalendar.js" type="text/javascript" &gt;&lt;/script&gt;
      &lt;!-- END JS FILES --&gt;
  
      &lt;title&gt;Permission System&lt;/title&gt;
  &lt;/head&gt;  
  </code></pre>
  
  <p><a href="http://speedy.sh/uXndZ/style.css" rel="nofollow">Here is a copy of my style.css:</a></p>
  
  <p>and my Full Calendar div:</p>
  
  <pre><code>&lt;div style="min-width: 45%; width: auto; float: left; margin-left: 0px;" id="calendar" &gt;&lt;/div&gt;
  </code></pre>
  
  <p>Please help I'm about to go crazy!</p>
  
  <p>I can send you teamviewer info if you think it would be easier to understand.</p>
  
  <p><a href="http://www.speedyshare.com/zenpp/all-css-tpl-and-pics.rar" rel="nofollow">All codes about css and some pics</a></p>