interesting little ditty

[steventhomasb]

Dear smart people,

I come back with a new FF/IE issue ive been stuck on all day trying to sort out if i have some ever so slight error, but unfortunately i cannot see it.

I just went through many pages of the forum trying to find something similar, all i found was that im not doing things the perfect way, but its working(mostly) and i would appreciate any advice first of all to do with the problem, followed distantly second by any advice/laughter/insults to do with using tonnes of divs for a layout


#bottomboarder {

border: 0px solid #FFFFFF;
z-index:0;
position:absolute; left:0px; bottom:0px;
width:100%;
height:30px;
background:url('BOTTOM.gif');
background-repeat:repeat-x;
}


#leftboarder {

border: 0px solid #FFFFFF;
z-index:0;
position:absolute; left:0px; top:0px;
width:30px;
height:100%;
background:url('LEFT.gif');
background-repeat:repeat-y;
}

right, so the first part works and a 30x30px image is repeated horizontally in both FF and IE, however the second part only works in FF, ive found that internet explorer doesnt seem to like the 100% idea for vertical image repeating, which is confusing as it worked horizontally

ok so ive tried, spaces/no spaces/quotation marks(broke everything :P)/ive even made sure i spelt everything in American


any constructive help would be most apreciated

Steven

[BonRouge]

You might want to post a link to your page...

By the way...dit·ty (dĭt'ē)
n., pl. -ties.

A simple song.

[Middle English dite, a literary composition, from Old French dite, from Latin dictātum, thing dictated, from neuter past participle of dictāre, to dictate.]

[steventhomasb]

Ive heard and used ditty in this fashion many times, some aspects relate, anyhow, very intersting, i had not looked the word up before to see its literal meaning.

Now, im sorry to say that i cant post a link as the website is offline still, and i wish it to be complete before i do upload, as most every other aspect is working perfectly at the moment i dont think one need to see it all, its just that height:100%; thing, im frustraited and baffled, the horizontal aspect works in internet explorer/FF, but vertical is only working in FF, and as far as i can see ive not gone wrong with wording

[BonRouge]

You'll be helping yourself if you upload your page and put it online for the good people here to have a look at it. There could be a number of reasons for your problem. It's sometimes difficult to diagnose without seeing the patient.

[ronaldb66]

It's sometimes difficult to diagnose without seeing the patient. In this case, it's impossible to say anything conclusive as even the basic stuff like the accompanying markup is missing.

Uploading a page to a server and giving us the link is not equal to opening up your deepest secrets to the world, you know; place it in a lower level directory if you feel spied upon, or create a stripped down test version that contains nothing you don't want exposed but shows exactly the behaviour you're having troubles with (there's a risk here in possibly omitting the cause of the problems as well).

For a first impression: I really can't see why you would position these absolutely (again, the rest is missing); secondly, 100% height is poorly supported in CSS. Think about it: 100% of what? Since absolutely positioned elements are taken out of the normal flow, this likely is even less clear.

[steventhomasb]

sorry guys, i went to work on stirping the site, and have spent the last 40 minutes trying to work out how to upload it, but here it is

http://www.freewebs.com/steventhomasb/website/website/desktop.html

i hope that will help, are you able to see the stylesheet somehow?


EDIT: the problem:the beautiful template boarder thing there displays in FF, but is broken in IE

steven

[danielwarner]

ok, first. Always validate your code!

Link:
http://validator.w3.org/check?uri=http%3A%2F%2Fwww.freewebs.com%2Fsteventhomasb%2Fwebsite%2Fwebsite%2Fdesktop.html

You cant expect every computer to read the code the same if it doesnt comply with standards so pick one and stick to it.

2nd. I dont think this will have screwed with the layout but may possibly be a problem that you have left off the closing </p> tag.

But first i recomend validating your code.

Daniel Warner

[ronaldb66]

Hmmm... seems to be "absolute positioning day" today: you're the third or fourth poster on short succession running into similar problems.

Your approach bares all the signs from someone recently switching from table layouts to CSS without making the mind shift necessary to apply CSS effectively and thus ending up in a tangle of absolutely positioned divs more or less replacing the former table cells.

Since several clever people, professionals in the field of website development, managed to fill a whole shelf of books about this subject it's hardly realistic to expect anyone to explain this in a single post (or even a whole bunch), but the top tip of the day would be: steer clear of absolute positioning.
Leave as many elements as you can in the normal flow, and work with floating as your number one positioning tool. If all else fails, and with a thorough understanding of its implications, sparingly use absolute positioning.

For your repeating image issue, read this article on A List Apart: "Onion Skinned Drop Shadows (http://www.alistapart.com/articles/onionskin/)" for the concept of layering images/elements, and "CSS Design: Creating Custom Corners & Borders (http://www.alistapart.com/articles/customcorners/)" for applying this concept to image corners and borders (there's a part II (http://www.alistapart.com/articles/customcorners2/) as well).

[steventhomasb]

thanks for the aid so far guys,

im horribly confused right now though, absolute is working, and thats all i want, i took a glance at that onion skin idea and am even more confused

this is my first website, and i want it to look how i want it to...absolutely, down to the pixil. i want it to look good, and ive designed it in pixil sizes, the peices fit together as it is, and it doesnt confuse me

the whole point of that horrible bunch of divs for the boarder was so that it could resize to anything inside it, while having my custom made boarder(not made yet...)

as for validation, there are 3 problems, and i havent a clue what each means

1)Error: no document type declaration; implying "<!DOCTYPE HTML SYSTEM>".
"<" html>

2)Error: character data is not allowed here.
...tivedesktop.css" type="text/css" rel="stylesheet" / ">"

3)Error: required attribute "ALT" not specified.
...c="link1.gif" width="100" height="30" ">"


is there a way to set a minimum div size? that might help... or perhaps someone knows a simple way of making a customised boarder that can resize to fit anything that goes inside it?

im not trying to make a career out of this, i cant stand numbers and nuances, i dont know what the standards are, i just want a working site that looks how i graphically designed it, to hold and show my art, if i ever get good at it that is

steven

EDIT: im giving those sites a better look, just incase i can figure something out from them, i cant thank you guys enough so far for trying to help

EDIT2: i missed one of the links you gave and it seems that its what i want, only in a pro acceptable format that should work(fingers crossed), but as its 1 30am im going to go to sleep and try to tackle making a new boarder in that style tomorow
thank you lads, if i manage to make it work ill try to not break any rules of this site and let you see the site all jazzed up.