Hi @sacconi!
Yes, it’s possible, it could be something like this:
@media screen and (min-width: 2000px) {
.wp-pagenavi {
padding-top: 35px;
margin-top: 0.85em;
text-align: right;
}
.navigazione {
max-width: 50%;
}
h1.page-title {
max-width: 50%;
}
}
I’ve using here your own HTML5 scaffolding and CSS.
Hope it helps or gives you an idea to do it.
Yes, it’s possible to align the title “Marina di Massa 42” and the navigation buttons on the same line, with the buttons positioned to the right side above the fourth picture. You can achieve this using CSS, and you don’t necessarily need to put them in the same div as long as the parent elements are structured correctly.
Here’s a general guideline on how to achieve this layout using CSS:
- HTML Structure: Ensure your HTML structure is set up appropriately. You should have a parent container for these elements and individual containers for the title and navigation buttons. For example:
<div class="container">
<div class="title">Marina di Massa 42</div>
<div class="navigation">
<!-- Navigation buttons go here -->
</div>
</div>
<div class="images">
<!-- Images go here -->
</div>
- CSS: You can use CSS to style and position these elements as described. Here’s some sample CSS code:
.container {
display: flex;
justify-content: space-between;
align-items: center;
}
.title {
/* Style for the title */
}
.navigation {
/* Style for the navigation buttons */
}
.images {
/* Style for the images */
}
In this CSS:
display: flex; makes the container a flex container, allowing you to control the positioning of its children.
justify-content: space-between; pushes the title to the left and the navigation buttons to the right, creating the desired layout.
align-items: center; vertically aligns the title and buttons.
- Adjust CSS Styles: Customize the CSS styles for the title and navigation buttons to achieve your desired appearance.
By following this structure and using CSS flexbox properties, you can place the title and navigation buttons on the same line, with the buttons to the right side above the fourth picture, all without necessarily needing to wrap them in the same div. However, you may need to adjust styles and fine-tune the layout to match your specific design.