我的CSS设计师做了一个设计,其中有两个ul兄弟姐妹从左到右排列.通过指定ul标签的宽度来完成布局.

他在Windows上使用Firefox,一切都很好.我在OS X上使用Firefox,其中一个li标签的内容有太多的文本,所以它流向另一行.设计的目的是将文本放在一行上.

有几点需要考虑:

• 我希望ul标签从左到右,而不是从上到下
• 我希望解决方案是i18n友好的(翻译字符串不应该导致它们分成两行)

如果这是以像素定义的,那么即使在同一个浏览器中,与Windows相比,它在OS X中的显示方式也不同？

是否有一般的CSS解决方案可以防止包装线或防止页面在OS X和Windows之间的换行方面看起来不同？或者这是一个失败的原因？

我是React和REDUX的新手,我只是开发一个简单的反应应用程序,现在我遇到一个问题,当我在我的组件中渲染一个输入元素如果我设置元素"值"它变成只读但是如果我设置了"defaultValue"上的值,当我重新更新状态时,它永远不会再次更新.

这是我的代码:

    import React from "react";
    export default class EditForm extends React.Component {

    editTransaction(event) {

        var transaction = this.props.transaction;

        event.preventDefault();
        var NewTransaction = {
            transactions_data: {
                amount: this.refs.amount.value
            }
        }

        this.props.editTransaction(NewTransaction, transaction.id);
    }

    closeForm() {
        this.props.closeForm();
    }

    render() {
        var {amount}=this.props.transaction;
        return (
            <div>
                <br/>
                <h4>Edit Transaction</h4>
                <div className="btn btn-danger pull-right" onClick={this.closeForm.bind(this)}>close</div>
                <div className="clearfix"></div>
                <form onSubmit={this.editTransaction.bind(this)}>
                    <div>
                        <label for="amount">Amount</label>
                        <input value={amount} onChange={(value) => this.onChange(value)} className="form-control"
                               id="amount" name="amount" type="number"
                               ref="amount"/>
                    </div>
                    <br/>
                    <br/>
                    <input className="btn btn-info" type="submit" value="submit"/>
                </form>
            </div>
        ); …

我有一个URL(例如http://www.example.com/OtterBox-77-24444-Commuter-Series-Optimus/dp/B00A21KPEI/ref=pd_sim_cps_4),想要截取它并在我的网页上预览它.意思是,用户点击预览按钮,PhantomJS需要以PNG/JPEG格式预览网页

我也可以使用任何其他开源.

我最近在React.js中编写组件.我从来没有使用像componentWillMount和的方法componentDidMount.

render是不可或缺的. getInitialState我写的其他辅助方法也派上用场了.但不是前面提到的两种生命周期方法.

我目前的猜测是它们用于调试？我可以在其中调用console.log:

componentWillMount: function() {
  console.log('component currently mounting');
},

componentDidMount: function() {
  console.log('component has mounted');
} 

还有其他用途吗？

也许任何有经验的Web开发人员应该熟悉这个问题:随着时间的推移你的CSS文件可以增长非常巨大的,丑陋的,因为所有的不再使用的选择,这可能是相当棘手找到.我正在研究一个我们倾向于经常重新设计东西的轨道项目,这导致了一吨无谓的CSS.查找和删除它的最佳方法是什么？

现在,我知道有一个专门为此目的而构建的称为deadweight的rails插件.但是,这是我的载重量问题:首先,它完全忽略了javascript中使用的选择器.接下来,它仅扫描您将其配置为扫描的页面,这意味着存在删除由于某种原因您未扫描的页面上使用的内容的风险.最后,它只在编译的css中找到未使用的选择器(我们使用LESS) - 将这些与实际代码相匹配有点过于复杂.

我也尝试过http://unused-css.com/ - 它们很棒,但无法访问localhost,而且只能扫描已编译的CSS.

我真的认为必须有更好的方法来做到这一点.实际上,前段时间我决定通过在整个项目目录中点击每个选择器来优化一个特定的css文件(emacs + rinari模式使它超级简单和超快),每次我都没有看到任何html或css在结果中我删除了样式.零问题,就像一个魅力.显然,我不打算在整个网站上这样做.但是,我真的不相信这不能自动化.现在,在我启动我的python并编写代码之前,任何人都可以告诉我,如果我要重新发明轮子吗？

我正在使用bootstrap,(好吧,我是新手),我发现这两个属性,有人可以解释一下吗？

今天我发现需要跟踪和检索Javascript错误堆栈跟踪来解决它们.

今天我们能够捕获所有其余的调用,这个想法是,一旦出现错误,自动发布该错误的堆栈跟踪以及其余已保存服务的响应,以便我们可以检测,重现和解决几乎相同的问题环境/局面.

作为一项要求,我们被要求制作一个可以包含而不会被侵入的模块,例如: 在一个JS中包含包含钩子逻辑的模块,将不是侵入性的,在各种JS文件中包含几行代码将是侵入性的.

目标是制作一个可以包含在已经开发的系统中的工具并跟踪错误事件(如控制台).

我已经读过这个跟踪器逻辑了:

• errorception.com/
• atatus.com/
• trackjs.com/
• airbrake.io/
• jslogger.com/
• getsentry.com/
• bugsense.com/
• qbaka.com/
• muscula.com/
• exceptionhub.com/
• debuggify.net/
• raygun.io/home

我们需要做类似的事情,跟踪错误并将其发送到我们的服务器.

正如"Dagg Nabbit"所说的那样...... "现在正在疯狂地发生错误,很难得到堆栈跟踪 ......"

所以,我们得到了很多付费产品,但它们是如何运作的呢？

在Airbrake中,他们使用stacktrace和window.onerror:

window.onerror = function(message, file, line) {
  setTimeout(function() {
    Hoptoad.notify({
      message : message,
      stack   : '()@' + file + ':' + line
    });
  }, 100);
  return true;
};

但我无法弄清楚堆栈跟踪何时真正使用.

在某些时候,stacktrace,raven.js和其他跟踪器需要try/catch.

1. 如果我们找到了制作全局包装器的方法会发生什么？
2. 我们可以调用stacktrace并等待捕获吗？

当客户端发生意外错误时,如何将堆栈跟踪发送到我的服务器？任何建议或良好做法？

我需要使我的网站的主要有980px width和500px height(class ="main")只有当鼠标在滚动div上并且有a height of 1500px和a width of 100%(class ="container-scroll")时才能修复,这是在其他div内部with height of 500px.(class ="container")

很困惑吧？

我做了一个小提琴,我几乎在那里,问题是,如果我设置主要固定,它将滚动页面,而不仅仅是在div内

这是我的小提琴:https: //jsfiddle.net/8oj0sge4/1/embedded/result/

HTML:

<div id="wrapper">
    <div class="container">
        <div class="container-scroll">
            <div class="main">

            </div>
        </div>
    </div>
</div>

CSS:

    #wrapper {
        width: 100%;
        height: 1500px;
        border: 1px solid red;
        padding-top: 380px;
    }
    #wrapper .container {
        border: 1px solid green;
        width: 100%;
        height: 500px;
        overflow: scroll;
    }
    #wrapper .container-scroll {
        height: 1500px;
        width: 100%;
        border: 1px solid yellow; …

我想构建小型应用程序.会有一些用户.我不想创建自己的用户系统.我想将我的应用程序与oauth/oauth2.0集成.

集成我的前端应用程序和oauth 2.0没有问题.有很多有用的文章,如何做到这一点,甚至在stackoverflow.com上.例如,这篇文章非常有帮助.

但.成功授权前端后我该怎么办？当然,我可以在客户端上标记"好吧,伙计,用户已经过身份验证",但我现在应该如何与我的后端进行交互？我不能只提出一些要求.后端 - 一些提供API函数的应用程序.每个人都可以访问此API.

所以,我的FE和BE之间需要一些auth系统.这个系统应该如何工作？

ps我有一些英语问题,可能我不能正确'问谷歌'.你能提供正确的问题吗:)或至少提供一些关于我的问题的文章.

UPD

我正在寻找概念.我不想为我当前的问题找到一些解决方案.我不认为我使用FE和BE的问题(无论如何我将在下面提供有关它的信息)

FE和BE将使用JSON进行通信.FE将发出请求,BE将发送JSON响应.我的应用程序将具有此结构(可能):

• 前端 - 可能是AngularJS
• 后端 - 可能是Laravel(laravel将实现逻辑,结构中也有数据库)

也许像google.com,vk.com,twitter.com等"服务提供商"会记得用户的状态？在FE成功验证后,我可以询问BE的用户状态吗？

我正在使用反应路由器作为root,并且"/"下的所有请求都被定向到路由器.当react路由器发现url与任何已定义的组件不匹配时,它会使用NoMatch组件进行渲染.这就解决了问题,NoMatch是渲染的,这就是我想要的,但状态代码仍然是200而不是404.当我的css或js文件放置错误的url react路由器做同样的事情时,它会响应200 !然后该页面告诉我,我的资源内容类型存在一些问题!

那么,我如何使用react路由器来处理"/"中的所有内容并仍然可以正确处理404错误(以404状态代码响应)？

反应路由器中的代码

render((
  <Router history={browserHistory}>
    <Route path="/" component={App}>
      <IndexRoute component={Index}/>
      <Route path="archived" component={App}>
        <IndexRoute component={ArchivedPage}/>
        <Route path="project/:projectId" component={ArchivedDetailPage}/>
      </Route>
      <Route path="*" component={NoMatch}/>
    </Route>
  </Router>
), document.getElementById('app'));

服务方面

  router.use('/', function(req, res, next) {
    res.render('index-react', {
      title: 'some title'
    });
  });