Fiddle: http://jsfiddle.net/CKgX8/2/
Add overflow: hidden;
to #animationentry
#animationentry{ overflow: hidden;}
Domanda
I have used Animate.css
for creating a left and right slide in effect. I can't figure out why the slides are adding up to the invisible width. Could any of you help me?
http://jsfiddle.net/itsnamitashetty/CKgX8/1/
<style>
body{
margin:0;
padding:0;
}
#animationentry{
width:100%;
height:700px;
margin:0;
padding:0;
background:green;
display:block;
}
#cww_bg{
display:block;
float:left;
width:50%;
background:red;
}
#crw_bg{
display:block;
float:left;
width:50%;
background:yellow;
}
</style>
<link type="text/css" rel="stylesheet" href="css/animate.css">
</head>
<body>
<div id="animationentry">
<div id="crw_bg" class="animated slideInLeft">
<img src="images/crw.jpg">
</div>
<div id="cww_bg" class="animated slideInRight">
<img src="images/cww.jpg">
</div>
</div>
</body>
</html>
Soluzione
Fiddle: http://jsfiddle.net/CKgX8/2/
Add overflow: hidden;
to #animationentry
#animationentry{ overflow: hidden;}