WebArtz - The Web Design Forum
Welcome to WebArtz, Guest!

WebArtz is a nice place for discussions related to web designing and coding. We help our members to code their own website templates with HTML and CSS. We give them advice on various issues.

To know more about WebArtz Forum, visit the About Us page.

At the moment, you are viewing the forum as a guest. As a guest you can't make post and participate in discussions. You need to register and become a member of the forum. Click the register link below and become a part of this forum.

Thank You


You are not connected. Please login or register

WebArtz - The Web Design Forum » Web Designing & Coding » CSS (Cascading Style Sheets) » 3 color on the border

View previous topic View next topic Go down  Message [Page 1 of 1]

1 3 color on the border on Mon Jan 10, 2011 5:11 pm

Matti


Registered Member
Registered Member
Hi guys,

Is it possible to have 3 color on the border like black, blue and red if so please give me a example.

2 Re: 3 color on the border on Mon Jan 10, 2011 7:49 pm

Guest


Guest
you can make it like this:
HTML:
Code:

<div id="1">
<div id="2>
Content
</div>
</div>

CSS:
Code:
#1 {border:1px solid black;}
#2 {border:1px solid red;outline:1px solid blue;}

3 Re: 3 color on the border on Mon Jan 10, 2011 9:31 pm

Axtrix


Registered Member
Registered Member
You could make it with an image

4 Re: 3 color on the border on Mon Jan 10, 2011 11:52 pm

McStormify


Registered Member
Registered Member
Gangstar, you missed at the quotation mark after the 2 in the div tag. This is the corrected code:

Code:
<div id="1">
<div id="2">
Content
</div>
</div>


CSS:

Code:
#1 {border:1px solid black;}
#2 {border:1px solid red;outline:1px solid blue;}

5 Re: 3 color on the border on Tue Jan 11, 2011 12:16 am

Guest


Guest
Actually he missed before that quotation mark:

http://www.w3.org/TR/html4/types.html#type-id

6 Re: 3 color on the border on Tue Jan 11, 2011 1:20 am

Guest


Guest
thanx for fixing ;D but i just was hurry Razz

7 Re: 3 color on the border on Tue Jan 18, 2011 10:32 pm

Matti


Registered Member
Registered Member
The css code didn't work for the forum border...

8 Re: 3 color on the border on Thu Jan 20, 2011 9:48 pm

ankillien


Administrator
Administrator
It is not possible to add more that 1 borders, I guess. You have to add more HTML elements (may be DIVs) in order to achieve this.

It requires template editing. Dion could suggest some 'trick' to make this easier?

9 Re: 3 color on the border on Fri Jan 21, 2011 12:20 am

Guest


Guest
As I said above, the example given here won't work...IDs cannot start with a number.

I would need more specifics about the problem to know whether this can be done through CSS and have it usable on all browsers.

If IE compatibility isn't important, one could use the CSS3 border-image property to achieve the desired effect. All one needs is the appropriate border image. Example:

Thinking outside the box...it's a good thing. Very Happy   

10 Re: 3 color on the border on Fri Jan 21, 2011 7:12 am

ankillien


Administrator
Administrator
Thats cool dion.

The codes above are wrong due to its invalid ID but I think it is a standard solution which can work on all browsers Smile

The border image technique is good as well but won't work in some browsers. Not sure if IE9 supports border image.

11 Re: 3 color on the border on Fri Jan 21, 2011 8:11 am

Guest


Guest
ankillien wrote:The codes above are wrong due to its invalid ID but I think it is a standard solution which can work on all browsers Smile

The border image technique is good as well but won't work in some browsers. Not sure if IE9 supports border image.

IE9 supports the border-image property, as do the current release versions of Firefox, Chrome, Safari, and Opera.

IE8 has partial support for the outline property, and then only if it is in standards mode and a DOCTYPE is declared. That's why I asked for more information...the only solution that will work reliably with all browsers is to use three boxes, each with its own border.

I would use the three-element approach if I were writing code that required such a feature.

12 Re: 3 color on the border on Sat Jan 22, 2011 9:43 pm

Guest


Guest
I added the numbers as an example.

13 Re: 3 color on the border on Fri Feb 11, 2011 10:04 pm

Matti


Registered Member
Registered Member
This can be locked.

14 Re: 3 color on the border on Sat Feb 12, 2011 8:49 am

Jophy


Registered Member
Registered Member
Solved => Locked

http://www.socialtechforum.com/

View previous topic View next topic Back to top  Message [Page 1 of 1]

WebArtz - The Web Design Forum » Web Designing & Coding » CSS (Cascading Style Sheets) » 3 color on the border

Permissions in this forum:
You cannot reply to topics in this forum