OutFront Forums
     Home    Register     Search      Help      Login    

Follow Us
On Facebook
On Twitter
RSS
Via Email

Recent Posts
Todays Posts
Most Active posts
Posts since last visit
My Recent Posts
Mark posts read

Sponsors
Shopping Cart Software
Ecommerce software integrated into Frontpage, Dreamweaver and Golive templates. No monthly fees and available in ASP and PHP versions.
Website Templates
We also have a wide selection of Dreamweaver, Expression Web and Frontpage templates as well as webmaster tools and CSS layouts.
Frontpage website templates
Creative Website Templates for FrontPage, Dreamweaver, Flash, SwishMax

 

Border question in CSS

 
View related threads: (in this forum | in all forums)

Logged in as: Guest
Users viewing this topic: none
Printable Version 

All Forums >> Web Development >> Cascading Style Sheets and Accessibility >> Border question in CSS
Page: [1]
 
paul rayner

 

Posts: 232
Joined: 3/15/2001
From: yeppoon, qld, aus
Status: offline

 
Border question in CSS - 11/7/2008 18:01:43   
Hi
is it possible to get a CSS border tom emulate the effect seen in this image?

Cheers


Thumbnail Image
:)

Attachment (1)

_____________________________

" In theory, there is no difference between theory and practice. But, in practice, there is!"
TexasWebDevelopers

 

Posts: 722
Joined: 2/22/2002
From: Dallas, TX
Status: offline

 
RE: Border question in CSS - 11/7/2008 18:53:57   
http://www.cssplay.co.uk/menu/tictactoe.html
Looks like 9 absolutely positioned 100px X 100px style p tags in an unordered list.
This is really fairly cool...

_____________________________

:)

Follow us on TWITTER

(in reply to paul rayner)
treetopsranch

 

Posts: 1539
From: Cottage Grove, OR, USA
Status: offline

 
RE: Border question in CSS - 11/7/2008 22:00:50   
Might be easier to just create a graphic.

_____________________________

Don from TreeTops Ranch, Oregon

"I've got a taste for quality and luxury"


(in reply to TexasWebDevelopers)
paul rayner

 

Posts: 232
Joined: 3/15/2001
From: yeppoon, qld, aus
Status: offline

 
RE: Border question in CSS - 11/8/2008 0:18:41   
I'd thought about using a graphic - I thought it might be too big, and that CSS might give a better file size.

_____________________________

" In theory, there is no difference between theory and practice. But, in practice, there is!"

(in reply to treetopsranch)
Tailslide

 

Posts: 6692
Joined: 5/10/2005
From: Out here on the raggedy edge
Status: offline

 
RE: Border question in CSS - 11/8/2008 1:55:56   
Yes but it's not practical! The stuff Stu produces on that site is brilliant - but a fair bit of it isn't for practical day to day use.

I'd split the graphic into 3 - have the top bit as a background for something at the top of the div - like a heading.

The side lines would be the background for the div itself.

The bottom bit would be the background for something at the bottom of the div - if you've just got a load of paragraphs then give the last one a class and attach the background.

_____________________________

Little Blue Plane Web Design | Land Rover project

:)

(in reply to paul rayner)
Tailslide

 

Posts: 6692
Joined: 5/10/2005
From: Out here on the raggedy edge
Status: offline

 
RE: Border question in CSS - 11/8/2008 2:23:05   
Here's a better way to do it:

TEST PAGE

In this case I stuck an inner div in there to hold the bottom image because it wouldn't actually work well on a paragraph. This method will expand with the content and works on IE6, IE7, FF and Opera (haven't checked any others).

_____________________________

Little Blue Plane Web Design | Land Rover project

:)

(in reply to Tailslide)
paul rayner

 

Posts: 232
Joined: 3/15/2001
From: yeppoon, qld, aus
Status: offline

 
RE: Border question in CSS - 11/8/2008 20:28:51   
Thanks Tailslide
that works very effectively

_____________________________

" In theory, there is no difference between theory and practice. But, in practice, there is!"

(in reply to Tailslide)
womble

 

Posts: 6007
Joined: 3/14/2005
From: Living on the edge
Status: offline

 
RE: Border question in CSS - 11/9/2008 5:26:45   
quote:

ORIGINAL: Tailslide

Here's a better way to do it:

TEST PAGE


Ooooh! That's niiiice Tail! Wombley likey! :)

I guess by splitting the image down more (though not making it half as complicated as Stu's example), you could probably get it to work as a liquid layout. Hmmmm...I might have to have a play with that later...

< Message edited by womble -- 11/9/2008 5:37:36 >


_____________________________

~~ "A cruel god ain't no god at all" ~~
~~ Erase hate. Practice love. ~~

(in reply to Tailslide)
Tailslide

 

Posts: 6692
Joined: 5/10/2005
From: Out here on the raggedy edge
Status: offline

 
RE: Border question in CSS - 11/9/2008 7:01:48   
Yes you could but you'd need more markup to attach the bits to.

_____________________________

Little Blue Plane Web Design | Land Rover project

:)

(in reply to womble)
Page:   [1]

All Forums >> Web Development >> Cascading Style Sheets and Accessibility >> Border question in CSS
Page: [1]
Jump to: 1





New Messages No New Messages
Hot Topic w/ New Messages Hot Topic w/o New Messages
Locked w/ New Messages Locked w/o New Messages
 Post New Thread
 Reply to Message
 Post New Poll
 Submit Vote
 Delete My Own Post
 Delete My Own Thread
 Rate Posts