Das Main Menü fixieren + Content verbreitern

swiftylein

Hallo,

habe mich schon mal durch die suche gequält und einiges ausprobiert nur leider hat nichts zu einer Veränderung oder Ergebnis geführt.
Ich möchte das Menü ganz oben fixiren so das es immer da ist wenn man runter scrollt.
Des weiteren möchte ich das der beitrags content responsive vergrößert wird und an die jeweilige größe des bildschirmes angepasst wird.

Link zur seite: https://life-to-journey.000webhostapp.com/blog/

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

Putzlowitsch

Also das Menü oben zu halten ist relativ einfach.

Der CSS-Klasse .navbar folgende Eigenschaften hinzufügen:

Code

position: fixed;
width: 100%;
z-index: 100;

Damit das Logo nicht darunter verschwindet, bei der ID #logo den ersten Wert vom Padding erhöhen, z.B. von 50px auf 80px:

Code

padding: 80px 0 45px 0;

Gruß
Ingo

swiftylein

Ich kann .navbar nicht in der css finden.
Muss dazu sagen habe auch wenig erfahrung mit dem css und code.

swiftylein

Description: Activello is a clean and minimal WordPress blog theme with premium look and feel well suited for food, fashion, travel, lifestyle, sports and any other awesome blogs. This theme features WooCommerce integration that allows you to create fully functional eCommerce website side by side with your blog. This theme has several customization options that are available WordPress Theme Customizer. Theme is also multilingual ready and translated in several languages. This awesome blog theme is also SEO friendly helping you to achieve the highest positions on Google. Activello is the only WordPress blog theme you will ever need.
Version: 1.4.2
Tested up to: 5.5
Requires PHP: 5.4.0
License: GNU General Public License v3 or later
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Text Domain: activello
Domain Path: /languages/
Tags: blog, entertainment, portfolio

This theme, like WordPress, is licensed under the GPL.

*/

/* Table of content
-----------------------------------------------
1. Global
2. Content
3. Post styling
4. Singe Post/Page Pagination
5. Media
6. Widgets
7. Buttons
8. Infinite Scroll
8. Custom Styles
9. Navigation
10. Comments
11. Attachment styling
12. Gallery
13. Footer
14. Social icons
15. Call For Action
*/

/* =Global
----------------------------------------------- */

Putzlowitsch

Du kannst die zusätzlichen Styles im "Theme-Customizer" ganz unten bei "Zusätzliches CSS" eingeben.

Code

.navbar {
   position:fixed;
   width:100%;
   z-index:100;
}
#logo {
   padding-top: 100px;
}

Gruß
Ingo

swiftylein

Ein riesen Dank dafür

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Das Main Menü fixieren + Content verbreitern

Jetzt mitmachen!