WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] [Theme: Hatch] How to make hover titles appear permanently? (3 posts)

  1. petemcal
    Member
    Posted 1 year ago #

    Hi I'm needing some help with my site http://www.becomeselfemployed.co.uk if the kind members here don't mind.

    If you visit the homepage you'll see that when you hover over one of the post thumbnails the title will appear.

    I want this hover activated title to be permanent (i.e. you can see the title permanently without having to hover over the thumbnail). Can anyone help me out?

    Here is the CSS code for the entry titles:

    /* Post titles
    -------------------------------------------------------------- */
    .hentry .entry-title {
    	margin: 0 0 0.6em 0;
    	padding: 0;
    	font-size: 1.083333333333333em;
    	line-height: 1.3em;
    	border: none;
    	color: #b60d0c;
    }
    .home .hentry .entry-title, .archive .hentry .entry-title {
    	font-weight: bold;
    	position: absolute;
    	bottom: 0;
    	right: 0;
    	max-width: 90%;
    	margin-bottom: 0;
    	background: #65a4d9;
    	opacity: 0;
    }
    .home .hentry:hover .entry-title , .archive .hentry:hover .entry-title  {
    	opacity: 0.98;
    }
    .singular .entry-title {
    	font-size: 2.6em;
    	font-weight: bold;
    	margin-bottom: 0.3em;
    }
    .singular-page .entry-title { color: #ccc; }
    .singular-page .entry-title { margin-bottom: 1.2em; }
    .singular-attachment .entry-title { margin-bottom: 1.1em; }
    .entry-title a, .entry-title a:visited { color: #222; }
    .home .hentry .entry-title a, .archive .hentry .entry-title a {
    	display: block;
    	padding: 10px 13px;
    }
    .entry-title a:hover { color: #5185b1; }
    .home .hentry .entry-title a:hover, .archive .hentry .entry-title a:hover { color: #222; }
  2. stoatoffear
    Member
    Posted 1 year ago #

    .home .hentry .entry-title, .archive .hentry .entry-title {
    	opacity: 1;
    }

    Opacity for this element is set to 0 (transparent).
    Set it to 1 for full opacity.

  3. petemcal
    Member
    Posted 1 year ago #

    Thanks for your help. Problem has been resolved :)

Topic Closed

This topic has been closed to new replies.

About this Topic