How to define two different layouts for the layouts in the same category but slightly different inches?

Question

I am testing my layout in eclipse's graphical layout. There are 5.4in FWVGA(480x854,mdpi) and 5.1in WVGA(480x800,mdpi) screens available to view in the graphical layout. If I am correct they both fall into large screen category, therefore I've put the layout xml into layout-large folder. And I've put my images into drawable-large-mdpi folder. But the image buttons are slightly off in 5.1in WVGA as you can see in the screenshots below. First is 5.1in, the second screenshot is 5.4'' and the correct one.

My second question which is similar to the above goes like this. I've done new layout for the Nexus 7 and put it into layout-sw600dp folder, and images to the drawable-tvdpi. Then I viewed this layout in the 7in tablet (1024x600,mdpi). And the image buttons are slightly off than it should look. The same way as in the first question.

I understand that the reason is probably because 5.1in and 5.4in isn't exactly the same even though they fall into the same category and I should have 2 different layouts for them. So how I should go about it? How can I have two different layouts? Or is there better solution, as I don't want to create a layout for each screen size that exist on the market. Here is xml file:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent" android:layout_height="match_parent"
    android:background="@drawable/wall4_cabinetclosed" android:orientation="vertical">

    <RelativeLayout android:id="@+id/frames_layout"
        android:layout_width="wrap_content" android:layout_height="wrap_content"
        android:layout_marginLeft="73dp" android:layout_marginTop="57dp">

        <ImageView android:id="@+id/fire_frame"
            android:layout_width="wrap_content" android:layout_height="wrap_content"
            android:layout_alignParentLeft="true" android:layout_alignParentTop="true"
            android:background="@drawable/small_fire_icon" />

        <ImageView android:id="@+id/water_frame"
            android:layout_width="wrap_content" android:layout_height="wrap_content"
            android:layout_alignTop="@+id/fire_frame" android:layout_marginLeft="75dp"
            android:layout_toRightOf="@+id/fire_frame" android:background="@drawable/small_water_icon" />

        <ImageView android:id="@+id/earth_frame"
            android:layout_width="wrap_content" android:layout_height="wrap_content"
            android:layout_below="@+id/fire_frame" android:layout_marginTop="71dp"
            android:layout_toLeftOf="@+id/water_frame" android:background="@drawable/small_earth_icon" />

        <ImageView android:id="@+id/wind_frame"
            android:layout_width="wrap_content" android:layout_height="wrap_content"
            android:layout_alignLeft="@+id/water_frame" android:layout_alignTop="@+id/earth_frame"
            android:background ="@drawable/small_wind_icon" />
    </RelativeLayout>

        <ImageView android:id="@+id/zoomed_image"
            android:layout_width="wrap_content" android:layout_height="wrap_content" />

    <Button android:id="@+id/frames" android:layout_width="210dp"
        android:layout_height="220dp" android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true" android:layout_marginLeft="55dp"
        android:layout_marginTop="30dp" android:onClick="zoomFrames" 
        android:background="@android:color/transparent"/>

    <Button android:id="@+id/blue" android:layout_width="115dp"
        android:layout_height="70dp" android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true" android:layout_marginLeft="220dp"
        android:onClick="zoomImage" 
        android:background="@android:color/transparent"/>

    <Button android:id="@+id/white" android:layout_width="85dp"
        android:layout_height="50dp" android:layout_alignParentRight="true"
        android:layout_alignParentTop="true" android:layout_marginRight="420dp"
        android:layout_marginTop="420dp" android:onClick="zoomImage"
        android:visibility="invisible"
        android:background="@android:color/transparent"/> 
        <ImageView
        android:id="@+id/fireplace"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="311dp"
        android:layout_marginLeft="67dp"
        android:background="@drawable/fire"
     />
            <ImageButton
        android:id="@+id/water_room"
          android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="310dp"
        android:layout_marginLeft="90dp"
        android:background="@drawable/view_water_room"
        android:onClick="finishFireRoom"
                android:visibility="gone"
        />
        <ImageView android:id="@+id/frames_zoomed_image"
        android:layout_width="fill_parent" android:layout_height="fill_parent"
        android:background="@drawable/frames_zoomed" android:onClick="hideZoomedFrames"
        android:visibility="gone"/>

    <RelativeLayout android:id="@+id/frameZoomedLayout"
        android:layout_width="wrap_content" android:layout_height="wrap_content"
        android:layout_marginTop="113dp" android:layout_marginLeft="145dp"
        android:visibility="gone"
        >

        <ImageButton android:id="@+id/fire_icon"
            android:layout_width="wrap_content" android:layout_height="wrap_content"
            android:background="@drawable/fire_icon" android:onClick="changeIcon" />
        <ImageButton android:id="@+id/water_icon"
            android:layout_width="wrap_content" android:layout_height="wrap_content"
            android:layout_alignBottom="@+id/fire_icon" android:layout_toRightOf="@+id/fire_icon"
            android:background="@drawable/water_icon" android:layout_marginLeft="147dp" android:onClick="changeIcon"/>
        <ImageButton android:id="@+id/earth_icon"
            android:layout_width="wrap_content" android:layout_height="wrap_content"
            android:layout_below="@+id/fire_icon" android:layout_marginTop="140dp"
            android:layout_toLeftOf="@+id/water_icon" android:background="@drawable/earth_icon" android:onClick="changeIcon"/>

        <ImageButton android:id="@+id/wind_icon"
            android:layout_width="wrap_content" android:layout_height="wrap_content"
            android:layout_alignLeft="@+id/water_icon" android:layout_alignTop="@+id/earth_icon"
            android:background="@drawable/wind_icon" android:onClick="changeIcon"/>
    </RelativeLayout>



</RelativeLayout>

Answer 1

in 3rd step set all ur device specific like screen, language etc all. and ur done