Petani Posted July 21, 2012 Share Posted July 21, 2012 hi all, i need your help. im not expert in css. im trying to create a header just like facebook. when i wrote css code, it successfully sticky to the top using "position:fixed", but when i change my screen resolution from 1366x768 to 800x600, it mess up. can you help how to create just like facebook has?? thanks so much b4. Quote Link to comment Share on other sites More sharing options...
Mahngiel Posted July 22, 2012 Share Posted July 22, 2012 since you're using a fixed position, you can take use of left and right css properties. take a peek: http://jsfiddle.net/PNqsm/ Quote Link to comment Share on other sites More sharing options...
Petani Posted July 22, 2012 Author Share Posted July 22, 2012 this my code: html <!DOCTYPE HTML> <html> <head> <title>my web</title> <meta http-equiv="content-type" content="text/html;charset=utf-8" /> <link rel="stylesheet" href="script/css/style.css" media="screen" /> </head> <body> <div id="wrap_body"> <div id="header"> <div id="header_menu"> MY HEADER </div> </div> </div> </body> </html> css code body { background:#f2f2f3; margin:0; } #wrap_body { height:auto; min-height:100%; width:100%; position:relative; } #header { height:auto; width:auto; position:static; color:#ffffff; } #header_menu { position:fixed; background:#424156; font-family:Arial; width:100%; } im still beginner in css, so help me friends. thanks b4 Quote Link to comment Share on other sites More sharing options...
Mahngiel Posted July 22, 2012 Share Posted July 22, 2012 so help me friends. thanks b4 Nobody is going to help you if you ignore their advice Quote Link to comment Share on other sites More sharing options...
Petani Posted July 23, 2012 Author Share Posted July 23, 2012 so so sorry Mahngiel, i dnt intend not to respect ur help. yesterday connection in city is so slow, n i wanna go out quickly, so that i cant open link u give me. that's why i decide to post my code. now, i use connection in my friend, look great. n i can see ur link u give me. thanks advanced. it works out Quote Link to comment Share on other sites More sharing options...
Petani Posted July 23, 2012 Author Share Posted July 23, 2012 sorry Mahngiel, it works out. but it's not what i want. i want to create header just like facebook's. when we scroll down it still sticky on the top. but when we change screen resolution to lowest or highest, the header keep follow it i try it,n the header successfully sticky on the top. but when i change screen resolution, it mess up. Quote Link to comment Share on other sites More sharing options...
Mahngiel Posted July 23, 2012 Share Posted July 23, 2012 the process of changing your screen resolution does not refresh your browser's rendering engine, which is why you can lose some pixels. i don't have a FB account to verify, it sounds like FB is using JS to ensure the header remains perfectly sized. Quote Link to comment Share on other sites More sharing options...
Petani Posted July 23, 2012 Author Share Posted July 23, 2012 hm.. may be friend, but i dnt really know much about it. hehe... thanks so much helping me so far. but i still need more clue from u n others about how to create it, beside i try to find it by myself. Quote Link to comment Share on other sites More sharing options...
Mahngiel Posted July 23, 2012 Share Posted July 23, 2012 but i still need more clue from u n others about how to create it, beside i try to find it by myself. You've got this forum community confused. Look at my signature line. You try stuff, we help guide. Quote Link to comment Share on other sites More sharing options...
hakimserwa Posted July 25, 2012 Share Posted July 25, 2012 us % not pixels Quote Link to comment Share on other sites More sharing options...
Petani Posted July 28, 2012 Author Share Posted July 28, 2012 but i still need more clue from u n others about how to create it, beside i try to find it by myself. You've got this forum community confused. Look at my signature line. You try stuff, we help guide. sorry for that friend ... this is my first time to ask to this forum. but it's fixed now, problem solved. ... Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.