Hello, I am new to this forum, so good day to everyone! I was wondering if any of you guys are experts on CSS? Or know enough to give me a hint to what I might be doing wrong? I am building a website for the student union at my university, please see example: http://www.dietistsektionen.se/v2/index.html I have removed all styling except the drop shadow. Can you see the annoying border at the very bottom of the page? How would you get rid of it? Very happy for any help // SNURK
I don't know where you got that shadow code, but SOMEBODY needs a beating. Hang on, I'll recode you something a little cleaner that doesn't need the hacks or 16k of images (for something that should use maybe 3k)
http://battletech.hopto.org/for_others/snurk/template.html the directory http://battletech.hopto.org/for_others/snurk is unlocked so you can get at the bits - it's not THAT different code-wise, but it relies on only two images that total 583 bytes combined. The layout is also fully dynamic by way of a 'sliding doors' technique up to 2048x1536. (one would hope you'd not need too much larger than that, though height-wise... maybe). To go fully dynamic to any hieght one would have to either axe the fades on the top-sides, or add two more containers and one more image. Hope this helps.
Thats nice deathshadow, but if you use just a three div style I think it might be more efficient. Such as make a header div that is a certain height and width. Then just add a background picture to that div with your drop shadow. Do the same for the footer div. The middle div can just be the width you want and only 1 pixel high with the a drop shadow on each side and it will just repeat as you add content making it very dynamic. It's a very easy commonly used practice.
Which is only possible if you give up the dynamic on one axis... and you might have to split the left/right images to separate entities. You could declare the way I wrote it up to 2048x1536... or more if you just adjust the images. And therein the problem - GOOD code should be able to adjust to any height and width - instead of 'a certain'. But then I consider ALL fixed layouts to be a /fail/ - which is why my code could theoretically be opened up to 100% screen width if one took care. meaning you lose his top shadow fades - which you might not have noticed and I did mention as a much easier solution. To be honest I would ADD two div's for those, then use a negative top-margin on the content area to ride it back up atop those, using the 1px high for the tile as you suggested. All of those though involve more files and/or larger file sizes. Honestly, I'd probably implement it on my own page using two images and nine DIV's.... but that would be fully dynamic to ANY size... something like: http://battletech.hopto.org/html_tutorials/fourcorners/template.html Which does outer border, inner border, with a stretch between the header and content, content area fully dynamic to any size in all directions, even the title area is dynamic height to 64px max, could easily be expanded - and the whole thing only uses two images totalling 663 bytes. Remember, one or two k of extra HTML/CSS isn't a big deal if it cuts 20-40k off your images and loses 8 or more handshakes in the process.