# Advanced: OfflineNotice NOT rendering on Android

**URL:** <https://forum.codewithmosh.com/t/advanced-offlinenotice-not-rendering-on-android/3878>\
**Category:** React Native\
**Created:** [April 4, 2021, 9:28pm UTC](https://forum.codewithmosh.com/t/advanced-offlinenotice-not-rendering-on-android/3878 "2021-04-04T21:28:29Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![JerryC](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.codewithmosh.com/jerryc/32/859_2.png) [@JerryC](https://forum.codewithmosh.com/u/JerryC)\
**Post date:** [April 4, 2021, 9:28pm UTC](https://forum.codewithmosh.com/t/advanced-offlinenotice-not-rendering-on-android/3878/1 "2021-04-04T21:28:29Z")

</div>

OfflineNotice NOT rendering on Android even if you take out the conditional.

DEVELOPER NOTES:  
Showing Offline Notice -  
NOT rendering, even when you comment out conditional  
See OfficelineNotice.js …

```
:
function OfflineNotice(props) {
   //const netInfo = useNetInfo();
   //console.log("netInfo: ", netInfo);

  //if (netInfo.type !== "unknown" && netInfo.isInternetReachable === false)
  return (
  <View style={styles.container}>
    <AppText style={styles.text}>No Internet Connection</AppText>
  </View>
);

//return null;
 :
container: {
  alignItems: "center",
  backgroundColor: colors.primary,
  height: 50,
  justifyContent: "center",
  position: "absolute",
  top: Constants.statusBarHeight,
  width: "100%",
  zIndex: 1,
},

```

CULPRIT: The **zIndex:1** property is NOT working, I.e.: The offline notice is NOT rendering on top.  
(It’s still hidden underneath) on Android.

Is OfflineNotice working for anyone using iOS?

---

<div class="post-metadata">

**Author:** ![JerryC](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.codewithmosh.com/jerryc/32/859_2.png) [@JerryC](https://forum.codewithmosh.com/u/JerryC)\
**Post date:** [April 4, 2021, 10:44pm UTC](https://forum.codewithmosh.com/t/advanced-offlinenotice-not-rendering-on-android/3878/2 "2021-04-04T22:44:47Z")

</div>

**FIX** : add container prop;  
**elevation: (Platform.OS === ‘android’) ? 1 : 0,**

```
container: {
   alignItems: "center",
   backgroundColor: colors.primary,
   elevation: (Platform.OS === 'android') ? 1 : 0,
   height: 50,
   justifyContent: "center",
   position: "absolute",
   top: Constants.statusBarHeight,
   width: "100%",
   zIndex: 1,
 },
```

---

<div class="post-metadata">

**Author:** ![FacuIguacel](https://avatars.discourse-cdn.com/v4/letter/f/8dc957/32.png) [@FacuIguacel](https://forum.codewithmosh.com/u/FacuIguacel)\
**Post date:** [April 19, 2022, 9:22pm UTC](https://forum.codewithmosh.com/t/advanced-offlinenotice-not-rendering-on-android/3878/3 "2022-04-19T21:22:11Z")

</div>

Is the Platform.OS conditional necessary? Would just using elevation: 1 work? I can’t test if it brakes something on iOS