• Resolved Anonymous User 9824923

    (@anonymized-9824923)


    hallo!

    My website has a landing page divided in box areas (red areas) and text areas (white areas).

    I’m trying to add this code

    .lp-text-content {
    margin-bottom: -100px;
    }

    to only the text-area-ONE, title CHICK-LIT PERSONAGENS, but I can’t figure out how. Can anyone help me?

    Best regards, Irina

    • This topic was modified 4 years, 7 months ago by Anonymous User 9824923.

    The page I need help with: [log in to see the link]

Viewing 8 replies - 1 through 8 (of 8 total)
  • That section has an ID of lp-text-one so you could use
    #lp-text-one .lp-text-content { margin-bottom: -100px }

    But negative margins often cause problems on differently sized windows, especially if you use pixel units.

    Thread Starter Anonymous User 9824923

    (@anonymized-9824923)

    Hallo, the code worked. THANK YOU SO MUCH! ??

    Hum… so whats it your tip to have the same negative margin and not use pixels?

    Well, I would need to understand why you need a negative margin in the first place.
    It seems to me that you can remove padding and margin from any element, so why close the gap with negative margins? Simply remove the space from the other element.

    But in general, you can use em, ex, rem, and ch to base it on the font size.
    You can use % to base it on the parent element(usually). With margin, it seems like % refers to width always; I’d have to look it up again.
    You can use vw for viewport width or vh for viewport height.
    You can see them all described here: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Values_and_Units#Numeric_data_types

    Thread Starter Anonymous User 9824923

    (@anonymized-9824923)

    Hallo. I’m using negative values because without it the text area has an huge space at the bottom after the content. You can see here: https://imgur.com/a/MHm5c6C

    Yes, it looks like you are trying to overcome some inline CSS that says

    .page-id-77 .gallery {
        margin-top: -46px;
        margin-bottom: 85px;
    }
    Thread Starter Anonymous User 9824923

    (@anonymized-9824923)

    I’m using that because the margins on those text areas are huge, I got that code in the wordpress press forum after asking for a support.

    So I studied the page you sent me, there is any site that can make the maths like -10px is equal to 10%? So I can use other unit?

    In your opinion in those units what it the best to substitute the negative pixel?

    Ah, you didn’t really understand what I said if you are asking that.
    Have you tried viewing your site from a phone? Or just a small browser window?
    If it looks okay, don’t worry about it.
    The point is that it’s a bit messy to put a negative margin on the parent element to counteract a margin on the child element. (just remove both)

    Thread Starter Anonymous User 9824923

    (@anonymized-9824923)

    Hallo! Hope you are fine. Yes, I always test the site in two notebookes 15″ and 12″; android mobile and tablet and ask my friend to see in iOS, so yes it is fine.

    I will close the topic, but continue to study the page you give so I can get it. Thank you so much for your help.

    I wish you the best

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Margin Bottom Specific Text Area’ is closed to new replies.