Ok I am in the middle of starting my portfolio site,this time taking on css3 with a few little tricks i have picked up along teh way, trying to keep imagery off the template as much as I can.
So I am playing about at the moment just started a page with a huge logo in type or selectable text rather than an image, I am trying something new with it Untitled Document
Take a peek
Anyway, the problem I am having is trying to get rid of the large amount of space I have at the foot of the page.
To make the âdesignâ text I used a series of spans with a display: block in teh css to make them stand on top of each otherâŚthis seems to be the problem âŚhowever I like this effect and how I achived it⌠I really just want to keep it but also lose that large amount of empty spaceâŚ
Ok I fixed it very happy indeed with the result Basically I got rid of all negatiove margins and floated teh two vertical words to the left and right BEFORE relatively positioning them on the screen.
Thanks for the comment I did indeed try your suggestion but it didnt work, I put a background colour on Content and teh container does shrink however the page remains quite long.
I am going to have anotehr play with it and try to get rid of those negative margins, I really have never used them until today as this is quite different from the kind of stuff i usually come up with
Just to say that is a really cool bit of design work there, Iâm very impressed at how youâve got it all lined up. Yes, the extra space at the bottom is because youâve used position:relative; with big negative values to pull the letters up the page.
A quick play around in Dragonfly suggests that you can set a height on #content and it will crop the content div at that point but will leave the relatively positioned text exactly where you want it. You can set height:1em; if thatâs all youâre having on the page, or work out the relevant height in ems (which should be pretty consistent across browsers, if youâre lucky) if you need anything following the crossword.
Disclaimer: I have tested this in Opera 11.5 but nothing else!