# E-Book by Glide. I tried to represent the new button bar with a small circle for page transitions

**URL:** <https://community.glideapps.com/t/e-book-by-glide-i-tried-to-represent-the-new-button-bar-with-a-small-circle-for-page-transitions/21478>\
**Category:** Project Showcase\
**Created:** [January 21, 2021, 5:16am UTC](https://community.glideapps.com/t/e-book-by-glide-i-tried-to-represent-the-new-button-bar-with-a-small-circle-for-page-transitions/21478 "2021-01-21T05:16:11Z")\
**Posts on this page:** 2\
**Page:** 2

<div class="post-metadata">

**Author:** ![hisashi.fujita](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/hisashi.fujita/32/17088_2.png) [@hisashi.fujita](https://community.glideapps.com/u/hisashi.fujita)\
**Post date:** [January 27, 2021, 1:37am UTC](https://community.glideapps.com/t/e-book-by-glide-i-tried-to-represent-the-new-button-bar-with-a-small-circle-for-page-transitions/21478/22 "2021-01-27T01:37:51Z")

</div>

The CSS of the text above the image is written as follows.

```
<img class="main_img" src="https://storage.googleapis.com/glide-prod.appspot.com/uploads-v2/uiPKquck3pdF45ZWLWDB/pub/2y5uGhomIGxW2zITObKS.jpg">
<p class="ptext_01">Enter any text</p>
<p class="ptext_02">Enter any text</p>
<style>
.main_img { 
width:345px;
height:345px;
object-fit: cover;
}
p.ptext_01,p.ptext_02 { 
position: absolute;
top: 0;
font-size: 1.2em; 
color: #000;
background: rgba(255,255,255,0.6); 
padding:20px 5px 10px 5px ; 
writing-mode: vertical-rl;
}
p.ptext_01 { right: 8%; } 
p.ptext_02 { right: 18%; }
</style>
```

---

<div class="post-metadata">

**Author:** ![kabookie](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/kabookie/32/10994_2.png) [@kabookie](https://community.glideapps.com/u/kabookie)\
**Post date:** [January 27, 2021, 9:10am UTC](https://community.glideapps.com/t/e-book-by-glide-i-tried-to-represent-the-new-button-bar-with-a-small-circle-for-page-transitions/21478/24 "2021-01-27T09:10:40Z")

</div>

Using the floating button is clever, but I don’t care for the location of it (right on the shadow line).

[Previous page](https://community.glideapps.com/t/e-book-by-glide-i-tried-to-represent-the-new-button-bar-with-a-small-circle-for-page-transitions/21478.md?page=1)