Move Post Information Text From Next To The Post To Under It

  • Unknown's avatar

    Hi the blog post information in red (specifically the site name ‘developingasaphotographer’) is overlapping the blurb text of the blog on the main page. I would like to move that information to underneath the blog blurb, so that it is no longer overlapping the blurb text

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar

    Your theme has multiple break-points, which basically means it rearranges the left and right section of your post excerpts many different ways depending on the screen size. Rather than checking and changing all of these different situations here’s a compromise you might find acceptable. Go to the CSS section of the customiser and paste in this code:

    .byline {
      overflow-wrap: break-word;
      word-wrap: break-word;
      hyphens: auto;
    }
    
    @media screen and (min-width: 1200px) {
      .entry-summary {
        width: 68%;
      }
      .entry-meta {
        width: 28%;
      }
    }

    The bottom section makes the meta section slightly larger on most laptop/desktop screens so the entire name will fit in, the top bit will split the author name and add a hyphen (in most modern browsers) when it’s resized for all the different tablet orientations. This will stop it overlapping with the other text.

    This actually looks like a bug with the Cerauno theme not coping well with long author names so I’m going to tag this post for staff to look at and hopefully they’ll refer it to the theme team to take a look.

    For staff: CSS Tricks has a good solution you could implement.

  • Unknown's avatar
  • Great tip, @hallluke. I’ll pass that along.

    @developingasaphotographer you’ve got a /* just before the code making it not work; you might want to take that out! :)

  • The topic ‘Move Post Information Text From Next To The Post To Under It’ is closed to new replies.