title: CSS not loading correctly on Jekyll (GitHub)
body: <p>My github page's css is being generated as</p>
  
  <p><a href="http://name.github.io/project/assets/css/main.css" rel="nofollow">http://name.github.io/project/assets/css/main.css</a>, but in the index.html it points to <a href="http://name.github.io/assets/css/main.css" rel="nofollow">http://name.github.io/assets/css/main.css</a></p>
  
  <p>I am using Jekyll with Gulp and SASS. I know this would work fine on a real .com domain but how do I make it correct on GitHub Pages?</p>
  
  <p>My gulpfile.js</p>
  
  <pre><code>var gulp        = require('gulp');
  var browserSync = require('browser-sync');
  var sass        = require('gulp-sass');
  var prefix      = require('gulp-autoprefixer');
  var plumber     = require('gulp-plumber');
  var cp          = require('child_process');
  var jade        = require('gulp-jade');
  
  var messages = {
      jekyllBuild: '&lt;span style="color: grey"&gt;Running:&lt;/span&gt; $ jekyll build'
  };
  
  /**
   * Build the Jekyll Site
   */
  gulp.task('jekyll-build', function (done) {
      browserSync.notify(messages.jekyllBuild);
      return cp.spawn('jekyll.bat', ['build'], {stdio: 'inherit'})
          .on('close', done);
  });
  
  /**
   * Rebuild Jekyll &amp; do page reload
   */
  gulp.task('jekyll-rebuild', ['jekyll-build'], function () {
      browserSync.reload();
  });
  
  /**
   * Wait for jekyll-build, then launch the Server
   */
  gulp.task('browser-sync', ['sass', 'jekyll-build'], function() {
      browserSync({
          server: {
              baseDir: '_site'
          }
      });
  });
  
  /**
   * Compile files from _scss into both _site/css (for live injecting) and site (for future jekyll builds)
   */
  gulp.task('sass', function () {
      return gulp.src('assets/css/main.scss')
          .pipe(sass({
              includePaths: ['css'],
              onError: browserSync.notify
          }))
          .pipe(plumber())
          .pipe(prefix(['last 15 versions', '&gt; 1%', 'ie 8', 'ie 7'], { cascade: true }))
          .pipe(gulp.dest('_site/assets/css'))
          .pipe(browserSync.reload({stream:true}))
          .pipe(gulp.dest('assets/css'));
  });
  
  /*
  * trying to Gulp stuff
  */
  gulp.task('jade', function() {
      return gulp.src('_jadefiles/*.jade')
      .pipe(jade())
      .pipe(gulp.dest('_includes'));
  })
  
  /**
   * Watch scss files for changes &amp; recompile
   * Watch html/md files, run jekyll &amp; reload BrowserSync
   */
  gulp.task('watch', function () {
      gulp.watch('assets/css/**', ['sass']);
       gulp.watch('assets/js/**', ['jekyll-rebuild']);
      gulp.watch(['index.html', '_layouts/*.html', '_includes/*'], ['jekyll-rebuild']);
      gulp.watch(['assets/js/**'], ['jekyll-rebuild']);
      gulp.watch('_jadefiles/*.jade', ['jade']);
  });
  
  /**
   * Default task, running just `gulp` will compile the sass,
   * compile the jekyll site, launch BrowserSync &amp; watch files.
   */
  gulp.task('default', ['browser-sync', 'watch']);
  </code></pre>
  
  <p>The _site folder is where all the generated HTML and CSS is. The only solution I can think of is moving the contents from the _site folder to the root of my git repo and deleting everything else that was there before.</p>
  
  <p>In my <code>_config.yml</code>, the basedir is even set to <code>baseurl: github-project-name</code> but still doesn't load.</p>