Server Help

Cerium

Im working on giving my site a makeover. Designing it in PS is a snap, but converting it to HTML is proving to be quite frustrating.

First, take a look at the demo: http://hybrid.shanky.com.
The part im working on is the content region (which has the post text). Everything else is fairly standard.

The problem comes from the number of elements it takes to build the content box:
1) The 4 black corner borders. (10x4 px)
2) Content border (2px around content region, #737373)
3) Content region (background: #787878)

#2 and #3 are easy enough to do, using a single DIV object and the border properties. The problem comes from positioning the 4 corner peices. As far as I know, theres no way to absolutely position an object relative to its container object.
So Im left with 4 objects (IMG or DIVs, doesnt matter) wihch need to be placed at the 4 corners of the container, with the content region in the middle.

Ive just spent the last hour playing with tables (ick) and every CSS property I know without results. Any and all help will be greatly appreciated.

-C
_________________
There are 7 user(s) ignoring me right now.

1stStrike · Cute like a kitty Joined: Dec 28 2002 Posts: 427 Offline

Do what I do. Bug Akai.

Solo Ace · Posted: Fri Jul 22, 2005 2:20 am *Post maybe stupid* Post subject:

Does bugging him actually help? Meh, teach me, 1st.

Smong · Posted: Fri Jul 22, 2005 3:25 am *Post maybe stupid* Post subject:

Do you want round corners?

I attached a zip file containing some images for the corners and a sample page with <style> tags in it. It uses <span> for the corners.

Cerium · Posted: Fri Jul 22, 2005 6:48 am *Post maybe stupid* Post subject:

No. While your example was useful, its not what im shooting for. The final should look like the image I linked to in my original post.

What you posted works perfectly for... well... exactly what you posted; However, theres a few things that make it not work for my design:

1) The corner image spans further horizontally than the text. Using the float property may align it correctly, but it keeps the object within the flow, effectively fucking up any text thats on the same line (in this case indenting my first line, which is not intended in the design).

2) While I will use an image if I have to, I would like to avoid it, since I can make the border using the border-(side) property set.
(Random trivia: This wont work in FF unless the objects display mode is 'block')

3) I hate... HATE using hacks for multiple browser support, which also makes me want to stray away from images. Again, I will if I must, but its more of a last resort kinda thing.

After looking at what you posted, I managed to get pretty damn close to what I want using the float property (contrary to #1) and a plethora of pixel perfect position offsets (which work in both FF and IE), but Im now forced to deal with that fucking indentation.

http://hybrid.shanky.com/jcreator.html
This is as far as Ive gotten, which works in FF and IE, without any CSS hacking (or images). Everything is aligned perfectly, except the text... and Im once again, stuck.

Edit:
The 'clear' property (and more ugly positioning) has saved the day. Check out the example and hit 'view source' to see what it took.

Thanks smong.

Gravitron · Posted: Fri Jul 22, 2005 8:23 am *Post maybe stupid* Post subject:

Request for help with CSS, something I work with on a regular bassis while making websites.
Oh wait, it was cerium who asked.

Should I be the bigger person? Hell no!

Forget it.

Chambahs · Power attack Joined: Jun 19 2005 Posts: 820 Offline

To SA:

yes it does actually work, but you have to be all over him, or else he doesnt do it, like he still owes me the following:

Website
Forums
sscentral webspace
Oral Sex
(cough)
A ship gfx
Bomb gfx
some animations

But he only gets on ICQ once in a blue moon, clever bastard

1stStrike · Cute like a kitty Joined: Dec 28 2002 Posts: 427 Offline

Akai has made several things for me in the past graphics/website related. I haven't actually talked to him in like..8 months though.

Confess · Zone Hoster Joined: Feb 10 2004 Posts: 532 Offline

Akai is a good boy, good boy! <pats head>
_________________
I know that I myself cannot do anything, that I will fall, and that I am a sinful man, but I know that I can do ANYTHING through God Almighty, whom strengthens me.

Gravitron · Posted: Sun Jul 24, 2005 7:10 am *Post maybe stupid* Post subject:

Hmm, the original SScouncil.com design I been working on when someone asked me to add content, was it akai or that Baka or wtfever character who made it?

Was a total mess...full of javascripts and tables...whoever done it shouldn't indulge in websiting.