WordPress.org

Forums

Spun
[resolved] Pages - Text in Circles (5 posts)

  1. suboy7
    Member
    Posted 2 years ago #

    Hello again,

    Is there an easy fix for getting the text to appear in the circles just like in the home screen? Right now, the text is showing up underneath the circles but I would like it the be the same as in the home screen. I have a child theme in place as well. Here a screen shot of the issue: http://snag.gy/XRSek.jpg

    Thanks!
    Alex

  2. Andrew Nevins
    Forum moderator
    Posted 2 years ago #

    Could you link to the page with the issue?

  3. suboy7
    Member
    Posted 2 years ago #

  4. Andrew Nevins
    Forum moderator
    Posted 2 years ago #

    Replace this in your Child Theme style.css file:

    .blog .hentry span.hometitle {
     width: 100%;
     position: absolute;
     top: 73px;
     display: table-cell;
    
     font-family: Baskerville, "Playfair Display", "Times New Roman", serif;
     font-size: 32px;
     font-size: 3.2rem;
     font-style: italic;
     text-shadow: 0 0 10px #fff;
     text-align: center;
    
     line-height: 1.2;
     vertical-align: middle;
     word-wrap: break-word;
     color: #111;
    
     overflow: hidden;
    
     transition: background .4s ease-in-out;
     -webkit-transition: background .4s ease-in-out;
     -moz-transition: background .4s ease-in-out;
     -o-transition: background .4s ease-in-out;
     -ms-transition: background .4s ease-in-out;
    }
    
    .blog .hentry {
     position: relative;
    }
    
    @media screen and ( max-width: 800px ) {
    	.blog .hentry span.hometitle {
    		font-size: 24px;
    		font-size: 2.4rem;
    	}
    }

    With this:

    .hentry span.hometitle {
     width: 100%;
     position: absolute;
     top: 73px;
     display: table-cell;
    
     font-family: Baskerville, "Playfair Display", "Times New Roman", serif;
     font-size: 32px;
     font-size: 3.2rem;
     font-style: italic;
     text-shadow: 0 0 10px #fff;
     text-align: center;
    
     line-height: 1.2;
     vertical-align: middle;
     word-wrap: break-word;
     color: #111;
    
     overflow: hidden;
    
     transition: background .4s ease-in-out;
     -webkit-transition: background .4s ease-in-out;
     -moz-transition: background .4s ease-in-out;
     -o-transition: background .4s ease-in-out;
     -ms-transition: background .4s ease-in-out;
    }
    
    .hentry {
     position: relative;
    }
    
    @media screen and ( max-width: 800px ) {
    	.hentry span.hometitle {
    		font-size: 24px;
    		font-size: 2.4rem;
    	}
    }

    Edited

  5. suboy7
    Member
    Posted 2 years ago #

    Very nice thanks!

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic

Tags

No tags yet.