I am currently in the process of moving a HTML5/CSS3/Javascript site I have been developing over to Node.js using express.js with Jade.
I have a container that holds fluid width, equally spaced divs (the text-justify method) that works great in plain HTML but when generated by Jade it fails to space them out (tested in chrome, firefox & opera). The confusing thing is that the rendered HTML and css properties are identical.
Plain HTML fiddle: http://fiddlesalad.com/html/fluid-column-layout-html-works
Jade Generated HTML fiddle: http://fiddlesalad.com/less/fluid-column-layout-jade-not-working/
It looks like text-align: justify; isn't working.... though I have no idea why.
I am new to Node.js, Express.js and Jade, so is it possible that my app.js or route handlers haven't been configured correctly (I used express --session test and npm install after updating my package.json to handle my depencies)?
Is there an alternative method of getting equally spaced, fluid divs that I can use (I have also tried this similar method: Fluid width with equally spaced DIVs)?
app.js:
/**
* Module dependencies.
*/
var express = require('express');
var routes = require('./routes');
var user = require('./routes/user');
var http = require('http');
var path = require('path');
var app = express();
// all environments
app.set('port', process.env.PORT || 3000);
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');
app.use(express.favicon());
app.use(express.logger('dev'));
app.use(express.json());
app.use(express.urlencoded());
app.use(express.methodOverride());
app.use(express.cookieParser('your secret here'));
app.use(express.session());
app.use(app.router);
app.use(express.static(path.join(__dirname, 'public')));
// development only
if ('development' == app.get('env')) {
app.use(express.errorHandler());
}
app.get('/', routes.index);
http.createServer(app).listen(app.get('port'), function(){
console.log('Express server listening on port ' + app.get('port'));
});
routes.js /* * GET home page. */
exports.index = function(req, res){
res.render('index', { title: 'Express' });
};
