Skip to main content

Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

  • This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #296902
    nicecss
    Participant

    Hi!

    I have a temporary page which I launched on takecashngo.com.

    The site is under development and will have several language versions. Therefore, the temporary page is also made for 3 main languages. English, Spanish and Chinese. The size of the text is slightly different, because of this, when you switch the page constantly jumps (central white block). I can change the texts, but is there any elegant way to solve this problem using CSS?

    I’ve set up a fiddle here (https://jsfiddle.net/gledgo/4q0drk9g/16/) but the effect is visible only on the site. I could not correctly move the code to the sandbox.

    If there is any simple way please suggest me. I certainly will not change the entire html-code because of this. But minor improvements can be made.

    Thanks for your time!

    #296903
    Paulie_D
    Moderator

    It seems to me that the div holding your logo is changing size based on teh size of the text in the sibling div.

    You need to make this consistent.

    At the moment it’s allowed to shrink

    .main-page .logo {
    -webkit-flex: 0 1 176px;
    flex: 0 1 176px;
    position: relative;
    z-index: 1;
    margin-right: 55px;
    }

    I’d suggest making the flex-shrink value 0

    #296943
    nicecss
    Participant

    Thank you! I’ll try it shortly.

    #296983
    nicecss
    Participant

    Thanks. I used this. Looks like it’s getting better.

Viewing 4 posts - 1 through 4 (of 4 total)
  • The forum ‘CSS’ is closed to new topics and replies.