AboutAndrew Hoffman Expertise I can field just about any question within this topic ranging from JavaScript to CSS, the two ingredients of DHTML. I`m very interested in the W3C and its validation rules for HTML, XHTML, and CSS, and enjoy answering questions of this type as well. I detest sleep and respond at all hours of the day or night.
Experience Experience in the area I've been working with DHTML and CSS for 7 years now and build/maintain websites of my own that implement DHTML navigation.
What I'm doing now My contract with Microsoft has ended and I am working for myself once again. Please contact me for any front-end work at antibland@gmail.com
Question Hi
I have a page, which I want to use tabs on it. I've designed tabs with CSS, with the following style syntax:
.tab1 {
position:absolute;
right:210;
top:105;
width:100px;
padding:4px;
text-align:center;
float:right;
cursor:pointer;
border:1px solid #B0BEC7;
border-bottom:0;
background: url(indentbg.gif) center center repeat-x;
}
.tab2 {
position:absolute;
right:310;
top:105;
width:100px;
height:33px;
color:#CC6633;
padding:4px;
text-align:center;
float:right;
border-top:1px solid #B0BEC7;
cursor:pointer;
background: url(indentbg2.gif) center center repeat-x;
}
.tab3 {
position:absolute;
right:410;
top:105;
width:100px;
padding:4px;
text-align:center;
float:right;
cursor:pointer;
border:1px solid #B0BEC7;
border-bottom:0;
background: url(indentbg.gif) center center repeat-x;
}
As you see, all of the CSS properties are the same, except the "right" position. I think it is not a good idea to declare values again and again while they have joint. So can you please provide me a better solution?
Answer .tab1,.tab2,.tab3 {
position:absolute;
top:105px;
width:100px;
padding:4px;
text-align:center;
float:right;
cursor:pointer;
border:1px solid #B0BEC7;
border-bottom:0;
background: url(indentbg.gif) center center repeat-x;
}
