# Blog links Mobile

**URL:** <https://community.hubspot.com/t/blog-links-mobile/64688>\
**Category:** CMS Development\
**Created:** [September 8, 2022, 12:09pm UTC](https://community.hubspot.com/t/blog-links-mobile/64688 "2022-09-08T12:09:36Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![CG9](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/cg9/32/76463_2.png) [@CG9](https://community.hubspot.com/u/CG9)\
**Post date:** [September 8, 2022, 12:09pm UTC](https://community.hubspot.com/t/blog-links-mobile/64688/1 "2022-09-08T12:09:36Z")

</div>

Hi,

My blog link is functioning correctly on desktop but not on mobile. What am I doing wrong? Posting the code as well as the link. If you go to the blog post and click on Read More, it loops you to pages rather than posts on mobile.

\<div class=“blog\_innr blog\_list”\>  
{% for rec\_post in contents %}  
\<div class=“blog\_box”\>  
\<div class=“blog\_img”\>  
{% if rec\_post.featured\_image %}\<a href=“{{ rec\_post.absolute\_url }}”\>\<div class=“blog\_listing\_cover”\>\<img  
src=“{{ resize\_image\_url(rec\_post.featured\_image, 313, 313) }}” alt=“{{ rec\_post.featured\_image\_alt\_text }}” /\>\</div\>\</a\>{% endif %}  
\</div\>  
\<div class=“blog\_txt”\>  
\<h4\>\<a href=“{{ rec\_post.absolute\_url }}”\>{{ rec\_post.name }}\</a\>\</h4\>  
\<p\>  
{% if loop.first %}{{ rec\_post.post\_list\_content|truncatehtml(380, false, ‘…’) }}{% else %}{{ rec\_post.post\_list\_content|truncatehtml(120, false, ‘…’) }}{% endif %}  
\</p\>  
\<a href=“{{ rec\_post.absolute\_url }}” class=“more\_btn”\>\<span\>Read More\</span\> \<i  
class=“fa fa-long-arrow-right”\>\</i\>\</a\>  
\</div\>  
\</div\>  
{% endfor %}  
\</div\>

> **[Online Learning Center | BiddingOwl](https://www.biddingowl.com/en-us/learning-center)**
>
> Fundraising can be overwhelming. We gathered tips and tricks to help you raise the most for your causes. Read our thoughts on best practices.

---

<div class="post-metadata">

**Author:** ![LeeBartelme](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/leebartelme/32/95647_2.png) [@LeeBartelme](https://community.hubspot.com/u/LeeBartelme)\
**Post date:** [September 8, 2022, 12:42pm UTC](https://community.hubspot.com/t/blog-links-mobile/64688/2 "2022-09-08T12:42:00Z")

</div>

I’m not sure what you are expecting or what the problem is. In Chrome they look the same when viewing the mobile view vs the desktop. What problem are you having?

---

<div class="post-metadata">

**Author:** ![CG9](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/cg9/32/76463_2.png) [@CG9](https://community.hubspot.com/u/CG9)\
**Post date:** [September 8, 2022, 2:50pm UTC](https://community.hubspot.com/t/blog-links-mobile/64688/3 "2022-09-08T14:50:45Z")

</div>

It looks the same, but it does not behave the same. When you click on the post or Read More it does not go to the blog post but to a listing page. The desktop works fine. Mobile does not.

---

<div class="post-metadata">

**Author:** ![LeeBartelme](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/leebartelme/32/95647_2.png) [@LeeBartelme](https://community.hubspot.com/u/LeeBartelme)\
**Post date:** [September 8, 2022, 3:18pm UTC](https://community.hubspot.com/t/blog-links-mobile/64688/4 "2022-09-08T15:18:01Z")

</div>

On mobile you have an :after related to the pagination next link that is covering the whole screen and intercepting the clicks.

 ![LeeBartelme_0-1662650250137.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/1/0/10d877856137f469302e3229b301fff9490d0a59.png)

If you click on it in the developer tools elements list you can see it covers the screen.

 ![LeeBartelme_1-1662650275920.jpg](https://d2qpr2jzcazej7.cloudfront.net/original/3X/9/b/9b119bf856bd936849cd08570ab1651c6c082801.jpeg)

---

<div class="post-metadata">

**Author:** ![CG9](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/cg9/32/76463_2.png) [@CG9](https://community.hubspot.com/u/CG9)\
**Post date:** [September 8, 2022, 3:45pm UTC](https://community.hubspot.com/t/blog-links-mobile/64688/5 "2022-09-08T15:45:19Z")

</div>

Thank you. I see that now and found the corresponding line in the CSS. I am new to this. How do I fix it? I tried to take :after out, but that didn’t help the matter. Would you mind guiding me?

---

<div class="post-metadata">

**Author:** ![LeeBartelme](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/leebartelme/32/95647_2.png) [@LeeBartelme](https://community.hubspot.com/u/LeeBartelme)\
**Post date:** [September 8, 2022, 3:50pm UTC](https://community.hubspot.com/t/blog-links-mobile/64688/6 "2022-09-08T15:50:36Z")

</div>

Well, is this like a custom template and CSS or is this something you installed or default or what? I think if you can _not_ make that :after psuedo element position absolute it fixes it on my end but it has other side effects.