/    Sign up×
Community /Pin to ProfileBookmark

FireFox ignoring top:25%

I am positioning an element like so:

<div style=”border:1px solid #000000; position: relative; top: 25%”>Test</div>

But FireFox is ignoring it, while ie7 is working fine. Any suggestions about how to get FireFox to listen to me?

Thanks ๐Ÿ˜ฎ

.Rye

to post a comment
HTML

10 Comments(s) โ†ด

Copy linkTweet thisAlerts:
@drhowarddrfineOct 02.2006 โ€”ย 25% of what? Do you specify the size of the parent container? IE attempts to guess at this but this is incorrect behavior.
Copy linkTweet thisAlerts:
@ryeterrellauthorOct 02.2006 โ€”ย Well, I declared the div in the body, so I assumed that? Do I set body width and height to 100%?
Copy linkTweet thisAlerts:
@ryeterrellauthorOct 02.2006 โ€”ย Well, that didnt work. Also, it gets the left side right, so why not the top? Hmm.
Copy linkTweet thisAlerts:
@ryeterrellauthorOct 02.2006 โ€”ย I tried wrapoing it in a div width and height 100%, too. No luck. ?
Copy linkTweet thisAlerts:
@ray326Oct 02.2006 โ€”ย Well, that didnt work. Also, it gets the left side right, so why not the top? Hmm.[/QUOTE]The body has a width defined by the width of the browser unless over-ridden. It doesn't have that with the height because web pages are assumed to be as tall as needed to hold the content.
Copy linkTweet thisAlerts:
@ryeterrellauthorOct 02.2006 โ€”ย The body has a width defined by the width of the browser unless over-ridden. It doesn't have that with the height because web pages are assumed to be as tall as needed to hold the content.[/QUOTE]
Okay, but I defined it and it still didnt work. ?
Copy linkTweet thisAlerts:
@WebJoelOct 02.2006 โ€”ย I am positioning an element like so:

<div style="border:1px solid #000000; position: relative; top: 25%">Test</div>

But FireFox is ignoring it, while ie7 is working fine. Any suggestions about how to get FireFox to listen to me?

Thanks :o

.Rye[/QUOTE]
that didn't work? it should. Firefox (compliant) is ...picky. Try doing this:

<div style="border:1px solid #000000; position: relative; top: 25%[COLOR=Red][B];[/B][/COLOR]">Test</div>

I think that this will help (note semi-colon at end of style)
Copy linkTweet thisAlerts:
@ryeterrellauthorOct 02.2006 โ€”ย That worked, thanks. ?

I can't believe it. ?

There needs to be a little popup that says, "; expected at line 3" or somesuch.

Where is my debugger?!?

hehe thanks again
Copy linkTweet thisAlerts:
@drhowarddrfineOct 02.2006 โ€”ย That ending semi-colon is NOT needed so I would assume there was a typo elsewhere.
Copy linkTweet thisAlerts:
@WebJoelOct 02.2006 โ€”ย That ending semi-colon is NOT needed so I would assume there was a typo elsewhere.[/QUOTE]
I would have said that too ('...that it makes no differance'), and with respect I have to say that once before I encountered [I]the same error[/I]... and my adding the 'missing' semi-colon seemed to correct the problem.

I finished the work, gave it back and sort-of never figured out why or even [I]if[/I] that was the actual cure. I merely ...remembered it for possible future use.

[I]Now I'll have to go and try to reproduce this 'error' and see if adding/removing the ";" actually works.[/I] :eek: At any rate, -I'm as surprised as anyone that it seemed to work for the postee... Firefox is picky. -Said it before. Even "comment" tags... Most browsers would accept <!--comment tag--> but Firefox get upset. -There should a space after the double-hyphen and before the closing double-hyphen. Under some conditions apparently, Fx throws a wobbly over 'bad' comment tags, too...
ร—

Success!

Help @ryeterrell spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 โ€” BETA 5.19,
whats_new: community page,
up_next: more Davinciโ€ข003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinciโ€ข003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...