Form-inline元素之间为什么没有空间？

演示：http://jsfiddle.net/sunnycpp/MPACc/4/Form-inline元素之间为什么没有空间？

相同的代码复制粘贴此： HTML

<div class="container"> 
    <debug-bar ng-controller="parentController"> 
    <debug-bar ng-controller="childController"> 
     <debug-bar ng-controller="oneMoreChildController"></debug-bar> 
    </debug-bar> 
    <debug-bar ng-controller="oneMoreChildController"></debug-bar> 
    </debug-bar> 
</div>

的Javascript

var angModule = angular.module('components', []); 
angModule.directive('debugBar', function() { 
    return { 
    restrict: 'E', 
    template: 
    '<div>'+ 
     '<form class="form-inline">' + 
      '<input type="text" class="input-small" ng-model="myText"/>' + 
      '<button class="btn btn-primary">Broadcast</button>' + 
      '<button class="btn btn-primary">Emit</button>' + 
     '</form>' + 
     '<div ng-transclude></div>'+ 
    '</div>', 
    transclude: true, 
    replace: true 
    }; 
}); 


function createController(myText) { 
    return function ($scope) { 
    $scope.myText = myText; 
    $scope.$on("event", function (senderText) { 
     console.log("Event received in:" + $scope.myText + " from Sender:" + senderText); 
    }); 
    $scope.$broadCastEvent = function() { 
     $scope.$broadcast("event", $scope.myText); 
     console.log("Sent event from:" + $scope.myText); 
    }; 
    }; 
} 

angModule.controller("parentController", createController("In parent")); 

angModule.controller("childController", createController("in FirstChild")); 

angModule.controller("oneMoreChildController", createController("in oneMoreChildController")); 
angModule.controller("oneMoreChildController", createController("in secondLevelChild"));

来源

2013-01-18 SunnyShah

因为你没有定义任何。：P的jsfiddle和引导重置边距，您不定义任何...

定义一些利润即可解决问题立即

input,button{ 
margin:0 5px; 
}

Example

来源

2013-01-18 08:20:01 Christoph

那么，为什么它工作在这种情况下，HTTP：/ /jsfiddle.net/sunnycpp/MPACc/12/？ – SunnyShah

@Sunny做到了吗？ http://jsfiddle.net/MPACc/13/ - 您在示例中看到的空间是内联元素之间的换行符。没有换行符，元素之间没有空格。您需要手动设置边距才能获得一致的行为。 – Christoph

哦！好。非常感谢你澄清我的疑惑。 – SunnyShah

Form-inline元素之间为什么没有空间？

回答

相关问题