title: Old fragment still visible after replacing with a new fragment
body: <p>I know there are tons of questions in this topic but none of them solved my problem. I have tab layout with a viewpager. This viewpager has 5 fragments. One of them is "My Files". When any of the item in this fragment is clicked, it is replace with another fragment. But my code is actually not replacing. The new fragment comes below the old fragment and both are visible and obviously the fragment on the top is clickable(old fragment). One solution included setting the background colour to white or something else. I can't do that as my app has a transparent background. </p>
  
  <p>Below is a screenshot :</p>
  
  <p><a href="https://i.stack.imgur.com/8nrxr.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/8nrxr.png" alt="enter image description here"></a></p>
  
  <p>Below is my code to replace fragment:</p>
  
  <pre><code> myFilesAdapter = new MyFilesAdapter(getContext(), new MyFilesAdapter.MyFilesItemClickListener() {
          @Override
          public void folderonclicklistener(FolderModel name, int position) {
  
  
  
              MyFilesSongs myFilesSongs = new MyFilesSongs();
  
              FragmentManager fm = getChildFragmentManager();
              fm.popBackStackImmediate(null, FragmentManager.POP_BACK_STACK_INCLUSIVE);
              FragmentTransaction fragmentTransaction = fm.beginTransaction();
              Bundle bundle = new Bundle();
              bundle.putString("parentPath",name.getFolderPath());
              myFilesSongs.setArguments(bundle);
              fragmentTransaction.replace(R.id.container,myFilesSongs);
              fragmentTransaction.setTransition(FragmentTransaction.TRANSIT_FRAGMENT_OPEN);
  
              fragmentTransaction.addToBackStack(null);
              fragmentTransaction.commit();
          }
      });
  </code></pre>