Dynadot โ€” .com Registration $8.99

100% div box not working

Spaceship Spaceship
Watch

Maylin

Established Member
Impact
7
Why is it if you make a .div box using css, and give it a width of 100% (not pixels) Why the box with border would stretch underneath the scrollbar, and not stop at 100% To the scrollbar?

Is there a way to correct this? :td:
 
0
•••
The views expressed on this page by users and staff are their own, not those of NamePros.
GoDaddyGoDaddy
Can you give us the url of the site that is exhibiting this problem? That would make it alot easier.
 
0
•••
I don't have a url, but I do have the code right here:

<html>
<head>
<title> huh? </title>



<style type= "text/css">

.top
{
position: fixed;
width: 100%;
height: 40%;
background-color: #101069;
border: 2px solid #00ff00;
padding: 0px;
margin: 0px;
}





</style>


</head>
<body>

<div class= "top"> hi </div>

</body>

All I'm trying to figure out is, why at 100% the div box goes outside the window on the far right and doesn't stay on the page? :td:
 
0
•••
position: fixed; maybe?

Couldn't a Border of any amount also cause this
since the border will be oustide the DIV?
 
0
•••
I've noticed with or without the border being on, it still goes "off the window" It works great when using relative. But what about fixed; why doen't it work with a fixed position? :td:
 
0
•••
Maylin said:
I've noticed with or without the border being on, it still goes "off the window" It works great when using relative. But what about fixed; why doen't it work with a fixed position? :td:

:relative allows it to be moved depending on the situation
:fixed is like saying it's Cement and cannot move, and alot of times with css that can cause problems

This place explains it well:
http://www.w3schools.com/css/pr_class_position.asp
 
0
•••
Yeah, but what I'm looking for is not the definition of fixed. I was wondering if a div box, set to a width of 100% Fixed can be corrected to fit the page, and not run off of the page. :td: Does anyone know what I'm talking about. help :td:

I was just wondering if such a thing can be corrected. :tu:
 
0
•••
I tested the code and it works fine for me?
 
0
•••
Try setting the width to something like 90%. Maybe your browser is confused and not taking the scrollbar width into account when doing it's math.
 
0
•••
I know what your talking about, i think you should take Monacos Advice as i have had problems with css being silly like that.
 
0
•••
What browser are you using that is giving you the problem?
 
0
•••
kpm547 said:
What browser are you using that is giving you the problem?

20 bucks says it's IE if the css and markup validates ^_^
 
0
•••
monaco said:
20 bucks says it's IE if the css and markup validates ^_^

I love it when die hard IE haters blame IE for everything acting as if it cant do anything, but yet when there is something FF cant do, it's causually mentioned.....
FF is known to not display all css properly as well.

Is there any single browser that can display all web elements 100% correctly?

hmmm..
 
Last edited:
0
•••
blacksnday said:
I love it when die hard IE haters blame IE for everything acting as if it cant do anything, but yet when there is something FF cant do, it's causually mentioned.....
FF is known to not display all css properly as well.

Is there any single browser that can display all web elements 100% correctly?

hmmm..

Now now...I never said I was a die hard IE hater. I made that comment in jest.

The fact is though, when I develop my sites, I develop side-by-side with firefox, because 99 percent of the time, when the CSS validates (e.g., not some stupid thing on my part) the layout looks great, exactly as I had intended. Then I fire it up in Opera, looks perfect. Konqueror looks great. Have a friend fire it up in Safari...usually looks fine.

Then I open it up in IE and theres problems out the yingyang...things off by n pixels, overlap bugs, tons of crap. For that reason, I tell people to use firefox or opera, not because I hate IE...IE works fine for alot of sites, but because Firefox and Opera work great on Windows, Mac, and Linux, with the same look on all 3 platforms. IE isnt even available on linux (well, with Wine it is, but that's a different problem), and the Mac version doesn't look the same as the Windows version, even if you use IE5 on both!

You're right about no browser doing *everything* right...but I think IE is among the worst of the browsers out there for failing to do things correctly and in a standards-compliant way.
 
0
•••
Dynadot โ€” .com Registration $8.99Dynadot โ€” .com Registration $8.99
Appraise.net
Unstoppable Domains
Domain Recover
DomainEasy โ€” Zero Commission
  • The sidebar remains visible by scrolling at a speed relative to the pageโ€™s height.
Back