Jump to content

Recommended Posts

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.

 

 

Link to comment
https://forums.phpfreaks.com/topic/266055-positionfixed-for-all-resolution/
Share on other sites

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

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 :)

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.

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.

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. :D ...

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.