Home › Forums › CSS › Clearing styles applied to IDs/Classes within IDs/Classes sharing the same name › Re: Clearing styles applied to IDs/Classes within IDs/Classes sharing the same name
August 30, 2012 at 5:06 pm
#108742
TravisJohnstonMember
Lol im not that dumb. Heres the code i was working with BEFORE the edit. Look at the big-image section.
#products-full /** Mix of overview and showcase **/
{
.panel-col-last
{
width:100%;
max-width:1210px;
margin-left:200px;
background-color:#d8d8d8;
padding-top:15px;
padding-bottom:50px;
color:#666666;
a,a:active
{
color:#2483AF;
}
.inside
{
margin:0;
margin-left:2px;
}
.internalright
{
padding:10px;
max-width:1150px;
width:100%;
margin-left:10px;
/** Top Tabs **/
.pane-products-bc
{
margin-bottom:20px;
height:20px;
.pane-title
{
display:none;
}
ul
{
li
{
float:left;
padding-right:10px;
text-transform:capitalize;
a
{
color:#000000;
}
}
li.active
{
color:#000000;
a
{
color:#000000;
}
}
}
}
.pane-products-tabs
{
clear:both;
margin-left:25px;
height:45px;
margin-bottom:-16px;
ul
{
li
{
float:left;
a
{
display:block;
padding-left:30px;
padding-right:30px;
padding-top:15px;
padding-bottom:10px;
font-size:1.6em;
color:#a3a3a3;
background-color:#666666;
border-top-left-radius:10px;
border-top-right-radius:10px;
}
a.active
{
background-color:#FFFFFF;
color:#2483af;
}
}
}
}
/** Title, Colors, Showcase **/
#the_big_image
{
height:470px;
max-width:470px;
width:100%;
float:left;
margin-right:25px;
margin-top:21px;
margin-left:10px;
#the_big_image /* here is the trouble area with my latest fix */
{
@include clear('clear-all');
}
img
{
height:470px;
max-width:470px;
width:100%;
}
}
/* ......more code here but no matter */
So with the change you selected
#products-full /** Mix of overview and showcase **/
{
.panel-col-last
{
width:100%;
max-width:1210px;
margin-left:200px;
background-color:#d8d8d8;
padding-top:15px;
padding-bottom:50px;
color:#666666;
a,a:active
{
color:#2483AF;
}
.inside
{
margin:0;
margin-left:2px;
}
.internalright
{
padding:10px;
max-width:1150px;
width:100%;
margin-left:10px;
/** Top Tabs **/
.pane-products-bc
{
margin-bottom:20px;
height:20px;
.pane-title
{
display:none;
}
ul
{
li
{
float:left;
padding-right:10px;
text-transform:capitalize;
a
{
color:#000000;
}
}
li.active
{
color:#000000;
a
{
color:#000000;
}
}
}
}
.pane-products-tabs
{
clear:both;
margin-left:25px;
height:45px;
margin-bottom:-16px;
ul
{
li
{
float:left;
a
{
display:block;
padding-left:30px;
padding-right:30px;
padding-top:15px;
padding-bottom:10px;
font-size:1.6em;
color:#a3a3a3;
background-color:#666666;
border-top-left-radius:10px;
border-top-right-radius:10px;
}
a.active
{
background-color:#FFFFFF;
color:#2483af;
}
}
}
}
/** Title, Colors, Showcase **/
> #the_big_image
{
height:470px;
max-width:470px;
width:100%;
float:left;
margin-right:25px;
margin-top:21px;
margin-left:10px;
img
{
height:470px;
max-width:470px;
width:100%;
}
}
/* ......more code here but no matter */
