Layout issue - tabs appearing inside tabs

I am trying to initialise Tabs + a Viewpager inside the fragment which is the initially shown tab after being selected from the Navigation fragment.

The tabs load, but the first fragment loads with tabs inside tabs, instead of a tabs layout parent with the child inside. The second fragment works as expected.

How can I wrap R.layout.fragment_offers_sent inside the rootView in the first fragment so that it displays as expected? I don't want to put this initialisation logic in the Activity as I only have one and it's not what calls these fragments.

First fragment (FragmentOffersSent):

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState) {
    View rootView = inflater.inflate(R.layout.fragment_offers_tabs, container, false);
    ViewPager viewPager = (ViewPager) rootView.findViewById(R.id.viewpager);
    viewPager.setAdapter(new OffersFragmentPagerAdapter(getFragmentManager(), getActivity()));

    SlidingTabLayout slidingTabLayout = (SlidingTabLayout) rootView.findViewById(R.id.sliding_tabs);
    slidingTabLayout.setDistributeEvenly(true);
    slidingTabLayout.setViewPager(viewPager);

    return rootView;
} 

Second fragment (FragmentOffersReceived):

public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState) {
    // Inflate the layout for this fragment
    return inflater.inflate(R.layout.fragment_offers_received, container, false);
}