I’m working through the errors in w3 Validator and came accross a specific error for each page.

” Element h1 not allowed as child of element span in this context. ”

The line it is referencing is the title header on every page:
<span><h1>Resident Login</h1></span> </div>

I need to find where in the code this is so that I can replace all of these spans with divs since you cannot have a block element inside of an inline element.

This is the Loop:

<?php $loop = new WP_Query( array( 'post_type' => 'testimonials') ); ?>
    <?php while ( $loop->have_posts() ) : $loop->the_post(); ?>
    <div class="entry-content">
        <?php the_title(); ?>
        <?php the_content(); ?>
    </div>
    <?php
     endwhile; 
     wp_reset_postdata(); ?>

This is the result:

<div class=”entry-content”>
Header
<div>
<div>
Post content
</div>
</div>
</div>

First-time forum user here. I’m creating a booking site for a digital detox company and I need a little customization help. My client asked if I could make a div surrounding an event listing completely clickable. Right now, only some of the text and the image next to the listing are clickable. See herebelow:

[redundant link redacted]

The div I want to make into a link is class=”qodef-event-list-item-content”

I’m using a theme called X-trail. Hopefully, this is enough information. Thank you.

I have an image with text beside it. Actually a series of images with text beside them. Looks beautiful on a desktop.

On mobile – the text squishes to the right of the image.
I would like it to react like a div with the text appearing beneath said image.

I thought Gutenberg Blocks would react this way but they don’t without going in to a custom html block and building divs.

This seems like this should be a common scenario for blocks, in theory, to handle. Otherwise, blocks seem like an extra step of work and are in the way.

Am I missing something? Can someone help?

See Example

Thanks!

Can someone please let me know exactly what boxes need to be unticked and which area to add those divs?

In order to attempt to achieve this result, I have adjusted the top position of the sections but doing this (I’m assuming this is the cause because playing around with the CSS I’ve managed to fix the mobile layout a bit better), my content overlaps horribly on mobile.

I will likely hide the arrows on mobile so I’m not concerned about those neat sections on mobile but is there a way to adjust the layout on desktop for my divs to be where I want them to be without making them go nuts on mobile? Or is my best bet going to be using media queries to adjust my div positioning?

I am building a post-grid that shows links to posts as an image with a text and when you hover the image is covered by a blue overlay with 50% opacity. I tried one out in JSFiddle and the result is fine but if I embed it into my grind the overlay overlaps the parent div. Also a small white border around the image appears.

This is the fiddle:
https://jsfiddle.net/vrVAP/3415/

the page where it is embedded is the following:
https://www.noroadback.com/test/

can someone please help? I cannot figure it out.

Thanks,

Thijn

I would like the featured content to be on the left side, as a single column, with stacked divs instead of horizontal on the top. Any support is appreciated, thanks!