Hejsa.
Jeg vil gerne have meget mindre mellemrum mellem min menu og mit indhold.
(se link for hvordan det ser ud nu)
https://knoglelaboratoriet.wordpress.com/?frame-nonce=bc2e369fa4
Jeg har prøvet diverse css koder med margin og padding, men intet lader til at virke.
Min HTML og CSS for homepage ser således ud:
HTML:
<!-- wp:jetpack/layout-grid {"column1DesktopSpan":3,"column1TabletSpan":4,"column1MobileSpan":4,"column2DesktopSpan":3,"column2TabletSpan":4,"column2MobileSpan":4,"column3DesktopSpan":3,"column3TabletSpan":4,"column3MobileSpan":4,"column4DesktopSpan":3,"column4TabletSpan":4,"column4MobileSpan":4,"className":"aParent column1-desktop-grid__span-3 column1-desktop-grid__row-1 column2-desktop-grid__span-3 column2-desktop-grid__start-4 column2-desktop-grid__row-1 column3-desktop-grid__span-3 column3-desktop-grid__start-7 column3-desktop-grid__row-1 column4-desktop-grid__span-3 column4-desktop-grid__start-10 column4-desktop-grid__row-1 column1-tablet-grid__span-4 column1-tablet-grid__row-1 column2-tablet-grid__span-4 column2-tablet-grid__start-5 column2-tablet-grid__row-1 column3-tablet-grid__span-4 column3-tablet-grid__row-2 column4-tablet-grid__span-4 column4-tablet-grid__start-5 column4-tablet-grid__row-2 column1-mobile-grid__span-4 column1-mobile-grid__row-1 column2-mobile-grid__span-4 column2-mobile-grid__row-2 column3-mobile-grid__span-4 column3-mobile-grid__row-3 column4-mobile-grid__span-4 column4-mobile-grid__row-4"} -->
<div class="wp-block-jetpack-layout-grid alignfull aParent column1-desktop-grid__span-3 column1-desktop-grid__row-1 column2-desktop-grid__span-3 column2-desktop-grid__start-4 column2-desktop-grid__row-1 column3-desktop-grid__span-3 column3-desktop-grid__start-7 column3-desktop-grid__row-1 column4-desktop-grid__span-3 column4-desktop-grid__start-10 column4-desktop-grid__row-1 column1-tablet-grid__span-4 column1-tablet-grid__row-1 column2-tablet-grid__span-4 column2-tablet-grid__start-5 column2-tablet-grid__row-1 column3-tablet-grid__span-4 column3-tablet-grid__row-2 column4-tablet-grid__span-4 column4-tablet-grid__start-5 column4-tablet-grid__row-2 column1-mobile-grid__span-4 column1-mobile-grid__row-1 column2-mobile-grid__span-4 column2-mobile-grid__row-2 column3-mobile-grid__span-4 column3-mobile-grid__row-3 column4-mobile-grid__span-4 column4-mobile-grid__row-4"><!-- wp:jetpack/layout-grid-column -->
<div class="wp-block-jetpack-layout-grid-column wp-block-jetpack-layout-grid__padding-none"><!-- wp:image {"id":154,"sizeSlug":"large"} -->
<figure class="wp-block-image size-large"><div class="container">
<div class="item">
<img src="https://knoglelaboratoriet.files.wordpress.com/2020/08/viforsker.png?w=750" alt="" class="wp-image-154" /></div></div></figure>
<!-- /wp:image --></div>
<!-- /wp:jetpack/layout-grid-column -->
<!-- wp:jetpack/layout-grid-column -->
<div class="wp-block-jetpack-layout-grid-column wp-block-jetpack-layout-grid__padding-none"><!-- wp:image {"id":168,"sizeSlug":"large"} -->
<figure class="wp-block-image size-large"><div class="container">
<div class="item"><img src="https://knoglelaboratoriet.files.wordpress.com/2020/08/levgodt-1.png?w=750" alt="" class="wp-image-168" /></div></div></figure>
<!-- /wp:image --></div>
<!-- /wp:jetpack/layout-grid-column -->
<!-- wp:jetpack/layout-grid-column -->
<div class="wp-block-jetpack-layout-grid-column wp-block-jetpack-layout-grid__padding-none"><!-- wp:image {"id":154,"sizeSlug":"large"} -->
<figure class="wp-block-image size-large"><div class="container">
<div class="item"><img src="https://knoglelaboratoriet.files.wordpress.com/2020/08/viforsker.png?w=750" alt="" class="wp-image-154" /></div></div></figure>
<!-- /wp:image --></div>
<!-- /wp:jetpack/layout-grid-column -->
<!-- wp:jetpack/layout-grid-column -->
<div class="wp-block-jetpack-layout-grid-column wp-block-jetpack-layout-grid__padding-none"><!-- wp:image {"id":154,"sizeSlug":"large"} -->
<figure class="wp-block-image size-large"><div class="container">
<div class="item"><img src="https://knoglelaboratoriet.files.wordpress.com/2020/08/viforsker.png?w=750" alt="" class="wp-image-154" /></div></div></figure>
<!-- /wp:image --></div>
<!-- /wp:jetpack/layout-grid-column --></div>
<!-- /wp:jetpack/layout-grid -->
<!-- wp:paragraph -->
<p></p>
<!-- /wp:paragraph -->
CSS:
.aParent div {
float: left;
clear: none;
margin: 5px;
}
.container {
position: relative;
width: 300px;
height: 400px;
overflow: hidden;
}
.item {
position: absolute;
top: 0;
left: 0;
}
.item img {
-webkit-transition: .6s ease;
transition: .6s ease;
}
.container:hover .item img {
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
Kan nogen mon hjælpe