473,796 Members | 2,483 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

Combining Styles

Hi All

If I had the following 3 style in a CSS file
<style>
.bordered {border: red thin soldid;}
.warning {background-color: #900;}
.box {padding: 5%; text-align:justify;}
</style>
Then in my html page I can do somthing like this:
<div class="box warning bordered">This is a warning.</div>

is there a way to "combined" the 3 styles into a 4th one eg:
<style>
.mywarning {box; warning; bordered}
</style>

so I can do things like this:
<div class="mywarnin g">This is a warning.</div>

and also still use the 3 original styles like:
<div class="bordered ">a border around me</div>
Thanks for any help/tips

Al.
Jul 20 '05 #1
6 6868
In article <vc************ *************** *****@4ax.com> in
comp.infosystem s.www.authoring.stylesheets, Harag
<ha***@softGETR IDOFCAPLETTERSh ome.net> wrote:
is there a way to "combined" the 3 styles into a 4th one eg:
<style>
.mywarning {box; warning; bordered}
</style>


No. There is no way in plain CSS to make a new class include the
properties of existing classes. Some sort of preprocessor could
probably do the job.

--
Stan Brown, Oak Road Systems, Cortland County, New York, USA
http://OakRoadSystems.com/
HTML 4.01 spec: http://www.w3.org/TR/html401/
validator: http://validator.w3.org/
CSS 2 spec: http://www.w3.org/TR/REC-CSS2/
2.1 changes: http://www.w3.org/TR/CSS21/changes.html
validator: http://jigsaw.w3.org/css-validator/
Jul 20 '05 #2
*Harag* <ha***@softGETR IDOFCAPLETTERSh ome.net>:

.bordered {border: red thin soldid;}
.warning {background-color: #900;}
.box {padding: 5%; text-align:justify;}

is there a way to "combined" the 3 styles into a 4th one


.mywarning, .bordered {border: red thin soldid;}
.mywarning, .warning {background-color: #900;}
.mywarning, .box {padding: 5%; text-align:justify;}

Virtually every CSS tutorial would have told you that in its "Selectors"
chapter.

--
Alcohol didn't cause the high crime rates of the '20s and '30s, Prohibition did.
And drugs do not cause today's alarming crime rates, but drug prohibition does.
(US District Judge James C. Paine, November 1991)
Jul 20 '05 #3
In article <bo**********@a riadne.rz.tu-clausthal.de> in
comp.infosystem s.www.authoring.stylesheets, Christoph Paeper
<cr***********@ gmx.net> wrote:
.mywarning, .bordered {border: red thin soldid;}


Shouldn't that be "sordid"? :-)

--
Stan Brown, Oak Road Systems, Cortland County, New York, USA
http://OakRoadSystems.com/
HTML 4.01 spec: http://www.w3.org/TR/html401/
validator: http://validator.w3.org/
CSS 2 spec: http://www.w3.org/TR/REC-CSS2/
2.1 changes: http://www.w3.org/TR/CSS21/changes.html
validator: http://jigsaw.w3.org/css-validator/
Jul 20 '05 #4
I'm dont think you quite understand what I was after.

I don't want to redefine "bordered, warning & Box" I just want to use
them in one class.

if I have in one css fiile "FX.css"
..Bordered {border: red thin solid;}
..bgCCC {background-color: #CCC;}
..bg00C {background-color: #00C;}
..bg0C0 {background-color: #0C0;}
..bgC00 {background-color: #C00;}
..Box {padding: 5%; text-align:justify;}

I want to beable to define things like
..Warning {Bordered; bgC00; Box;)
..Note {bg00C; Box}

then in my html i can do:
<div class="Warning" >this is a warning</div>

instead of:
<div class="Box Bordered bgC00">this is a warning</div>

if I want to change the background color of warnings throughout the
page then I can just edit the ".Warning {Bordered, bgC00, Box)" and
change it to ".Warning {Bordered, bgCCC, Box)" rather than edit every
DIV on the page where the warning is used.

Hope this is made clearer.

Al.
On Sun, 2 Nov 2003 02:26:41 +0100, Christoph Paeper
<cr***********@ gmx.net> wrote:
*Harag* <ha***@softGETR IDOFCAPLETTERSh ome.net>:

.bordered {border: red thin soldid;}
.warning {background-color: #900;}
.box {padding: 5%; text-align:justify;}

is there a way to "combined" the 3 styles into a 4th one


.mywarning, .bordered {border: red thin soldid;}
.mywarning, .warning {background-color: #900;}
.mywarning, .box {padding: 5%; text-align:justify;}

Virtually every CSS tutorial would have told you that in its "Selectors"
chapter.


Jul 20 '05 #5
In article Harag wrote:
I'm dont think you quite understand what I was after.

I don't want to redefine "bordered, warning & Box" I just want to use
them in one class.

if I have in one css fiile "FX.css"
.Bordered {border: red thin solid;}
.bgCCC {background-color: #CCC;}
.bg00C {background-color: #00C;}
.bg0C0 {background-color: #0C0;}
.bgC00 {background-color: #C00;}
.Box {padding: 5%; text-align:justify;}

I want to beable to define things like
.Warning {Bordered; bgC00; Box;)
.Note {bg00C; Box}
That is not possible using CSS.
then in my html i can do:
<div class="Warning" >this is a warning</div>

instead of:
<div class="Box Bordered bgC00">this is a warning</div>

if I want to change the background color of warnings throughout the
page then I can just edit the ".Warning {Bordered, bgC00, Box)" and
change it to ".Warning {Bordered, bgCCC, Box)" rather than edit every
DIV on the page where the warning is used.


You might want to use some server side language.

--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Saapi lähettää meiliä, jos aihe ei liity ryhmään, tai on yksityinen
tjsp., mutta älä lähetä samaa viestiä meilitse ja ryhmään.

Jul 20 '05 #6
*Harag* <ha***@softGETR IDOFCAPLETTERSh ome.net>:

I'm dont think you quite understand what I was after.
Be assured I did.
I don't want to redefine "bordered, warning & Box" I just want to use
them in one class.


Because that is not possible the way you want it, I showed you the way it is
possible with CSS. The result is virtually the same.

--
"Opportunit y is missed by most people
because it is dressed in overalls and looks like work."
Thomas Alva Edison
Jul 20 '05 #7

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

0
1989
by: Quinton | last post by:
I'm running a website that uses CSS to format the text and a CGI program Coranto that icludes news updates via SSI. My problem is that some parts of the CSS don't seem to take effect on the included news. All four link styles are used, and all four work in the included text files. The text styles, on the other hand, seem not to work at all. The text that's part of the actual HTML file is formated according to the CSS codes. However, the...
2
3277
by: Chris Mullins | last post by:
I've spent a bit of time over the last year trying to implement RFC 3454 (Preparation of Internationalized Strings, aka 'StringPrep'). This RFC is also a dependency for RFC 3491 (Internationalized Domain Names / IDNA) which is something that I also need to support. The problem that I've been struggling with in .NET is that of Unicode Code Points > 0xFFFF. These points are encoded into UTF8 using the Surrogate Pair encoding scheme that...
7
4819
by: Barry | last post by:
Hi all, I've noticed a strange error on my website. When I print a capital letter P with a dot above, using & #7766; it appears correctly, but when I use P& #0775 it doesn't. The following capital letters all work correctly - B C D F G M S T with the diacritical marker &#_0775. Why am I having a problem with P?
12
2578
by: dan.vendel | last post by:
Hi, I know nothing about javascript, but quite a lot about regulat html and CSS. Have bumped into a problem that people in this fine congregation perhaps can help me with. I'm making a webshop. When user eventually ends up at the credit card processor's secure pages, the styles are quite different from the actual site's. I have managed to change some basics through a control
3
1480
by: JezB | last post by:
What's the generally accepted approach for using Styles and Stylesheets in a web application based on .aspx files, Web Controls, User Controls, and code-behind modules (c# in my case)? Most style and stylesheet guides on the internet seem to be based on web sites (rather than applications) based on relatively static textual information. I have read that external stylesheet files are the way to go, but it seems to me that these only lend...
3
2046
by: spolsky | last post by:
hi, it is possible to apply multiple styles as shown in the following example. <STYLE TYPE="text/css"><!-- BODY { background-color:salmon; } P { margin-left:20px; } .clsCode { font-family:"Comic Sans MS"; font-size:10pt; color:navy;}
2
2894
by: TonyV | last post by:
Okay, this is driving me nuts, and while I'm still researching, I'm hoping someone here can help. I'm trying to create a simple page with a navigation menu on the left side of the main content area. On the right side, I have a content div that contains an h1 title and a table that I'd like to take up the full width of the div (but not, of course, run over the navigation menu). So I try something like this in my CSS:
4
2713
by: splounx | last post by:
Hi there, I am a relative CSS & JavaScript novice and I have a particular problem that is beyond my level of knowledge so I thought I'd tap the collective wisdom of this group. I would like to know if there is a means of writing JavaScript that will dynamically display the styles which are currently applied to any DOM element on a web page ( i.e., those applied by ID, those applied by class, etc.) as the user moves their mouse over...
5
5643
by: Tristan Miller | last post by:
Greetings. Is it possible using HTML and CSS to represent a combining diacritical mark in a different style from the letter it modifies? For example, say I want to render Å‘ (Latin small letter o with a double acute accent), but with the o in black and the double acute accent in green. Are either of the following valid? 1. <span style="color: black;">o</span><span style="color: green;">&#x030B;</span>
0
9680
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main usage, and What is the difference between ONU and Router. Let’s take a closer look ! Part I. Meaning of...
0
9528
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...
0
10455
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...
0
10228
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth. The Art of Business Website Design Your website is...
1
7547
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...
0
6788
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...
0
5573
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
1
4116
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
3
2925
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.