Border left over

View previous topic View next topic Go down

avatar
grimofdoom
Member
Member
Forum Posts : 106
Member Since : 2012-03-06
View user profile

Postgrimofdoom on 27/3/2012, 2:24 pm

I am trying to make a menu bar that wil stay fixed and cover the whole top and from left to right covering. Buit i keep getting about 10-20 pixel width left on all sides(exept bottom) and it doesnt stay fixed.(i am uising css in it by the way). here is what i got:(made it myself, so it kinda sucks)
Code:
<head><title>Menu Bar</title><style type=text/css>
.bar{
right:0;
top:0;
align:fixed;
background-color:lightpink;}</style></head><body>
<div class=bar>The height is determined by the size of the Logo itself</div>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>test 1

by the way, the breaks are there to test it's align being fixed.
avatar
grimofdoom
Member
Member
Forum Posts : 106
Member Since : 2012-03-06
View user profile

Postgrimofdoom on 27/3/2012, 3:02 pm

Nevermind, i fixed it.first i forgot left and then i called it align and not position.
avatar
Mike
Administrator
Forum Posts : 446
Member Since : 2011-10-28
View user profile http://www.codinghelp.org

PostMike on 27/3/2012, 3:14 pm

Why is there like 3,000 line breaks? o.O
avatar
grimofdoom
Member
Member
Forum Posts : 106
Member Since : 2012-03-06
View user profile

Postgrimofdoom on 27/3/2012, 3:25 pm

1. i had said after the code"by the way, the breaks are there to test it's align being fixed."
2. now i need to know how to unhide and hide with mouseover
avatar
Vanilla990
Administrator
Forum Posts : 114
Member Since : 2011-10-30
View user profile

PostVanilla990 on 27/3/2012, 4:36 pm

on the mouseover, you want to set the name of the menu-bar so its something like {

#menu-bar {display:none;}

#menu-bar:hover {display:block;}

that way, it will be hidden until someone rolls over the area and then the bar will display. I haven't tested this theory for this scenario but its worked for similar examples in the past.
avatar
grimofdoom
Member
Member
Forum Posts : 106
Member Since : 2012-03-06
View user profile

Postgrimofdoom on 27/3/2012, 5:21 pm

i do not get where i am sapposed to put those commands. and also,i have this(but i cant figure out how to get divs(class's)bright and bleft to fit the white blank space)
Code:
<head><title>Template</title><Style type=text/css>

body
{height:100%}
.info
{float:left;left:20px;top:50px;background-color:red;width:10%;height:100%;}
.adv
{float:right;right:20px;top:50px;background-color:red;width:10%;height:100%}
.content
{background-color:blue;width:100%;height:100%;top:20%;}
.bar
{right:0px;top:0px;left:0px;position:fixed;background-color:lightpink;float:left;}
.copy
{bottom:0px;background-color:green;float:bottom;left:0%}
.bleft
{float:left;left:0px;height:100%;background-color:yellow}
.bright
{float:right;right:0px;height:100%;background-color:yellow}

</style></head><body>
<!-menu bar-->
<div class=bar>The height is determined by the size of the Logo itself</div>
<!-main content now-->


<div width=100% height=100%><div class=bleft></div><div class=info width=10%>this box is for user information</div><div class=content width=100%>Content goes here</content><div class=adv width=10%>advertisements here</div><div class=bright></div></div><div class=copy><center>Copyright Timothy Leitzke</center></div>

</body>
avatar
Vanilla990
Administrator
Forum Posts : 114
Member Since : 2011-10-30
View user profile

PostVanilla990 on 28/3/2012, 3:48 am

Ignore my idea, it doesn't work Sad I was hoping it would be incredibly simple and only need a display code but I can't seem to get it to work myself.

With regards to the white space, that is easily fixed by adding "margin:0px;" to the body css.

Most browsers automatically add a small margin to css. It can be annoying but it's easily overwritten.
avatar
grimofdoom
Member
Member
Forum Posts : 106
Member Since : 2012-03-06
View user profile

Postgrimofdoom on 28/3/2012, 4:52 am

margin dont work,float left doesnt help, width still leaves the space.
avatar
Vanilla990
Administrator
Forum Posts : 114
Member Since : 2011-10-30
View user profile

PostVanilla990 on 28/3/2012, 6:41 am

Thats odd because I put the entire code you pasted into a notepad document added "margin:0px;" to the body css and it removed the white spacing on the left and right side of the screen.
avatar
BryanR
Member
Member
Forum Posts : 12
Member Since : 2012-03-23
View user profile

PostBryanR on 28/3/2012, 6:48 am

Yeah, Vanilla990 is right, I don't think the code looks organized with all those breaks, not that a code has to be organized, anyways nice code, try what Vanilla990 said, it worked for me.
avatar
grimofdoom
Member
Member
Forum Posts : 106
Member Since : 2012-03-06
View user profile

Postgrimofdoom on 28/3/2012, 9:10 am

First of all, i had posted a remake of the code(and the breaks were there for testing the fixed bar at the top). and second of all, i want to have a div take the left-over white spacing so i can put a border there.
avatar
Vanilla990
Administrator
Forum Posts : 114
Member Since : 2011-10-30
View user profile

PostVanilla990 on 28/3/2012, 9:53 am

In that case, why not just set a background color or image or add a border to the left and right divs?
avatar
grimofdoom
Member
Member
Forum Posts : 106
Member Since : 2012-03-06
View user profile

Postgrimofdoom on 28/3/2012, 10:31 am

I was going to use that as a last resort.
Sponsored content

PostSponsored content

View previous topic View next topic Back to top

Create an account or log in to leave a reply

You need to be a member in order to leave a reply.

Create an account

Join our community by creating a new account. It's easy!


Create a new account

Log in

Already have an account? No problem, log in here.


Log in

 
Permissions in this forum:
You cannot reply to topics in this forum