Javascript 将内部div移动到外部父div的右下角

我希望使用

float:right

将内部

div

放在外部div的右下角，但由于某些原因，它将保留在左下角。我做错了什么

#外部{
宽度：100%；
身高：20%；
边框：1px纯黑；
位置：绝对位置；
}	
#内在的{
宽度：50像素
高度：50px；
边框：1px纯红；
位置：绝对位置；
浮动：对；
底部：0；
}

右下角；	

添加

右侧：0

如果元素处于绝对位置，则浮动该元素不会对其产生任何影响

#外部{
宽度：100%；
身高：20%；
边框：1px纯黑；
位置：绝对位置；
}
#内在的{
宽度：50px高度：50px；
边框：1px纯红；
位置：绝对位置；
底部：0；
右：0；
}

右下角；

更改外部div的css属性，如下所示：

#inner {
     width: 50px
     height: 50px;
     border: 1px solid red;
     position: absolute;
     bottom: 0; 
     right:0
}