Forums

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

Home Forums Design z-index, fixed position, Chrome , Opera

  • This topic is empty.
Viewing 15 posts - 1 through 15 (of 16 total)
  • Author
    Posts
  • #186619
    khaan85
    Participant

    Hi , i have problem with z-index and fixed position.I have two div , first
    #out {
    border: 1px solid #e3aff1;
    width:280px;
    position: relative;
    background-color: #45619D;
    margin-top:3px;
    z-index:2;
    }
    second
    #profil_names {
    position: fixed;
    background: none repeat scroll 0 0 #e9edf1;
    font-size: 16px;
    height: 20px;
    padding:10px;
    color: #0084c6;
    width: 708px;
    z-index:1;
    }

    My idea is #out to see first and then #profil_names.The code work fine of IE,Firefox , but other browsers , #profil_names overlapping first , other div (#out).How can I decide this issue?

    #186622
    __
    Participant

    Could you make an example (maybe use codepen) so we can see what you’re talking about?

    From your description, I would suspect that your two divs overlap simply because of their size, and the fact that they are absolutely positioned.* But I couldn’t be sure without seeing a demo.

    * in many cases, absolute positioning is not actually what you want.

    #186640
    khaan85
    Participant

    Hi , i make same code like my site, it’s work right here , but on my site not work .I will show you.
    http://codepen.io/khaan85/pen/ufFsq , #out div is “none” it’s become “block ” and jump when i start to search people in my site.
    it’s my site in Mozilla , IE , https://www.flickr.com/photos/128102071@N08/15395681687/
    it’s my site in Opeta,Chrome
    https://www.flickr.com/photos/128102071@N08/14961549753/

    #186641
    Paulie_D
    Member

    Hi , i make same code like my site, it’s work right here , but on my site not work

    Then perhaps we need to see the site…do you have a link?

    #186643
    khaan85
    Participant

    it’s on the localhost server :((,but today i will put it on the host server

    #186675
    __
    Participant

    i make same code like my site, it’s work right here

    This? Are you saying that this is correct?

    Looking at your css, you seem to be using fixed and/or absolute positioning almost exclusively. This is almost always not a good approach. The result is usually fragile, and tailored to only one browser and/or screen size.

    However, I will wait to see your actual site before offering suggestions.

    #186676
    khaan85
    Participant

    Hi again
    My site is http://www.bestbody.eu . You may use for login in site
    mail: [email protected]
    pass: password

    Thanks

    #186677
    __
    Participant

    login doesn’t work.

    #186680
    khaan85
    Participant

    Try again , i check now and work always ,copy it without whitespace.

    #186723
    khaan85
    Participant

    Do you someone else help me ?

    #186764
    __
    Participant

    Alright:

    I’m fairly sure that your problems are a result of using fixed/absolute positioning basically everywhere. I’m sure there is one “magic” screen size (i.e., your screen size) where everything looks basically correct, but I can’t find it. I can’t even see the whole site unless the window is greater than 1080 pixels wide. It is very difficult to work with.

    As for the #out and #profil_name divs, they don’t appear to “overlap” each other at all, in any browser I have available. #out is an empty 280×0px div in your search box; it’s not even close to #profil_name.

    Perhaps you can explain your problem in more detail?

    #186769
    khaan85
    Participant

    Okay resolution of my display 1366 x 768
    Firefox work right
    https://www.flickr.com/photos/128102071@N08/14974214364/
    Chrome Opera work wrong
    https://www.flickr.com/photos/128102071@N08/15408863698/
    I understand a little bit CSS sorry.

    #186839
    khaan85
    Participant

    i fix some responsible design problems , do you have someone to help me with my big problem?

    #186932
    khaan85
    Participant

    i understand that problem is z-index and webkit ,but not decide it

    #186941
    Paulie_D
    Member

    i understand that problem is z-index and webkit ,but not decide it

    Actually no…

    I’m fairly sure that your problems are a result of using fixed/absolute positioning basically everywhere. I’m sure there is one “magic” screen size (i.e., your screen size) where everything looks basically correct, but I can’t find it. I can’t even see the whole site unless the window is greater than 1080 pixels wide. It is very difficult to work with.

    Try learning better ways of laying out pages.

    Absolute/Relative positioning has its place for specific effects but as a page layout method…its worse than tables.

    http://learnlayout.com/

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