Android Design Library - Floating Action Button Padding/Margin Issues

after a few time searching and test solution i fix my problem with add this line to my xml layout only:

app:elevation="0dp"
app:pressedTranslationZ="0dp"

and this is my whole float button layout

<android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:layout_marginRight="16dp"
        android:layout_marginBottom="16dp"
        android:src="@drawable/ic_add"
        app:elevation="0dp"
        app:pressedTranslationZ="0dp"
        app:fabSize="normal" />

No more fiddling with styles.xml or with .java files. Let me make it simple.

You can use app:useCompatPadding="true" and remove custom margins to maintain same margins across different versions of android

The extra margin/padding you saw on the FAB in your second picture is due to this compatPadding on pre-lollipop devices. If this property is not set, it gets applied on pre-lollopop devices and NOT in lollipop+ devices.

Proof of concept

Update (Oct 2016):

The correct solution now is to put app:useCompatPadding="true" into your FloatingActionButton. This will make the padding consistent between different API versions. However, this still seems to make the default margins off by a little bit, so you may need to adjust those. But at least there's no further need for API-specific styles.

Previous answer:

You can accomplish this easily using API-specific styles. In your normal values/styles.xml, put something like this:

<style name="floating_action_button">
    <item name="android:layout_marginLeft">0dp</item>
    <item name="android:layout_marginTop">0dp</item>
    <item name="android:layout_marginRight">8dp</item>
    <item name="android:layout_marginBottom">0dp</item>
</style>

and then under values-v21/styles.xml, use this:

<style name="floating_action_button">
    <item name="android:layout_margin">16dp</item>
</style>

and apply the style to your FloatingActionButton:

<android.support.design.widget.FloatingActionButton
...
style="@style/floating_action_button"
...
/>

As others have noted, in API <20, the button renders its own shadow, which adds to the overall logical width of the view, whereas in API >=20 it uses the new Elevation parameters which don't contribute to the view width.