Sequence css changes

For support and discussion related to templates and themes in phpBB 3.3.
Post Reply
User avatar
bennybernaer
Registered User
Posts: 599
Joined: Tue Mar 22, 2011 9:53 pm
Contact:

Sequence css changes

Post by bennybernaer »

Maybe a stupid question, but does it matter what order you put your css changes in?

Some elements don't show (unless I put them from the bottom of the page).
I find this a bit odd. I always assumed it didn't matter at all.


Or could it be that my modified css is now starting to become very extensive?

Code: Select all

/*  perso Custom Style Sheet  */


/**********************************************/
/*************** common.css *******************/
/**********************************************/
body {
	padding: 0;
}

.wrap {
    border-radius: 0px;
}

.page-body {
	margin: 0 10px 4px;
	padding-bottom: 12px;
	clear: both;
}

h3 {
	font-size: 1.2em;
	color: #676767;
}

p {
	font-size: 1.2em;
}

.headerbar {
	padding-top: 1px;
}

.navbar ul.linklist {
    font-size: 12px;
}

div.rules {
	margin-bottom: 30px;
	padding: 15px;
	border-left: 3px solid;
}

.rules strong:first-child {
    display: block;
}

.forumdescription  {
  font-size: 13px;
}

.navbar-header-top {
    padding: 12px 10px;
    border-radius: 0;
    font-size: 1.1em;
}

.navbar-header-top ul {
    max-width: 1152px;
    margin-inline: auto;
}

.navbar-header-top ul.linklist {
    font-size: 12px;
}

.navbar-footer {
    padding: 12px 10px;
    border-radius: 0;
    font-size: 1.1em;
}

.navbar-footer ul {
    max-width: 1152px;
    margin-inline: auto;
}

.navbar-footer ul.linklist {
    font-size: 12px;
}

/* ------- Round cornered boxes and backgrounds ------- */
.headerbar, .navbar, .forabg, .forumbg, .panel, .post, div.rules, .pagination li a, .pagination li span,
.action-bar .button, .dropdown .dropdown-contents, .button {
	border-radius: 0px;
}

.forabg, .forumbg, .viewtopic_wrapper  {
    background: rgba(0,0,0,.025);
	margin-bottom: 20px;
	padding: 0px;
	clear: both;
}

.viewtopic_wrapper {
	padding: 10px 10px 5px;
}

.bg1 {
	background-color: #FCFCFF;
}

.bg2 {
	background-color: #FFFFFF;
}

ul.topiclist.forums, ul.topiclist.topics {
    padding: 7px 0;
}

ul.topiclist.forums li.row, ul.topiclist.topics li.row {
    margin: 0 7px;
}

.post h3 a.first-unread,
.post:target h3 a {
	color: #676767;
}

.panel {
	background-color: #FBFBFF;
	margin-bottom: 4px;
	padding: 5px 10px;
}

.post {
	padding: 5px 10px;
	margin-bottom: 4px;
	background-repeat: no-repeat;
	background-position: 100% 0;
	position: relative;
}

.rowbg {
	margin: 5px 5px 2px 5px;
}

/* ------- Subforums ------- */
.subforum  {
  font-size: 13px;
}

.sub-forumlist ul {
	float: left;
	list-style-type: none;
	margin-left: 20px !important;
}

.sub-forumlist li {
	line-height: 1.5em;
}

/* ------- Pagination in viewforum for multipage topics ------- */
.row .pagination li a, .row .pagination li span {
	border-radius: 2px;
	padding: 1px 3px;
	font-size: 10px;
}

/* ------- Table styles ------- */
table.table1 thead th {
	font-weight: normal;
	text-transform: uppercase;
	line-height: 1.3em;
	padding: 10px;
}


/*********************************************/
/*************** links.css *******************/
/*********************************************/
a { color: #676767; }

a.forumtitle, a.topictitle {
	font-size: 1.5em;
	color: #303030;
	font-weight: 400;
}

.username-coloured {
    font-size: 12px;
}

.forumbg .header a:hover, .forabg .header a:hover, th a:hover {
	color: #aa0000;
}


/**********************************************/
/*************** content.css ******************/
/**********************************************/
li.row strong {
	font-weight: bold;
}

li.header dt {
    font-size: 1.2em; /* category header / forum title font size */
}

li.header dt, li.header dd {
	line-height: 1em;
	border-left-width: 0;
	margin: 14px 0;
	padding-top: 2px;
	padding-bottom: 2px;
	font-size: 1.7em;
	font-family: Arial, Helvetica, sans-serif;
	text-transform: none;
}

li.header dt {
	font-weight: normal;
	width: 100%;
	margin-right: -440px;
}

li.header dd.posts, li.header dd.topics, li.header dd.views .icon {
	padding-right: 10px;
}

li.header dd.simpleposts .icon {
	margin-left: -10px;
}

dd.posts, dd.topics, dd.views { 
	font-size: 1.3em;
	margin-top: 6px;
}

.content h2, .panel h2 {
	font-size: 2em;
	color: #676767;
}

/* ------- Statistieken ------- */
.alt_block {
	margin-bottom: 30px;
}

.alt_block li.header dl.row-item    {
	background: #343840;
	padding-left: 0px;
}

.stat-block  {
    padding: 4px 12px 12px;
	margin-bottom: 0px !important;
}

.stat-block p {
	margin-bottom: 0;
}
 
/* ------- Poster profile block ------- */
.postprofile {
    text-align: center;
	border-color: #ECF0F1;
}

/* ------- Post-profile avatars ------- */
.postprofile .avatar {
	float: none;
}

.postprofile .avatar img {
    margin: 0 auto;
}

.avatar {
    border-radius: 75px;
}

/* ------- Post author ------- */
p.author {
	font-size: 14px;
}


/**********************************************/
/*************** buttons.css ******************/
/**********************************************/
.button {
	padding: 4px 10px;
}

.button-search,
.button-search-end  {
	padding: 4px 7px;
}

.post .button {
	padding-top: 6px;
	padding-bottom: 6px;
}


/**********************************************/
/**************** forms.css *******************/
/**********************************************/
dd select {
	padding: 7px;
}

.inputbox {
	padding: 7px;
}


/**********************************************/
/**************** icons.css *******************/
/**********************************************/
.search-box .inputbox {
	background-image: none;
	border-right-width: 0;
	border-radius: 0px;
	height: 28px;
	padding: 3px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.icon, .button .icon, blockquote cite:before, .uncited:before {
  	font-size: 16px;
}

.icon:before {
    padding-right: 2px;
}

.icon.icon-md {
	font-size: 12px;
    margin-right: -5px;
}
 

/**********************************************/
/**************** Merlin.css ******************/
/**********************************************/
.responsive_forumlist_row_stats {
	margin-top: 4px;
}

/* ------- Simple Forumlist ------- */
dd.simpleposts {
	text-align: center;
	line-height: 2em;
	width: 160px;
}

dd.simpleposts span {
	display: block;
}

li.row dd.simpleposts {font-size: 1.3em;}
li.row dd.simpleposts span {font-weight: 300; }

/* ------- Topic Types ------- */
.topic_type {
	display: inline-block;
	padding: 2px 2px 2px 4px;
	font-weight: 500;
	float: right;
	margin-right: 3px;
}

.topic_type span {
	display: inline-block;
	text-transform: lowercase;
}

.topic_type span::first-letter {
	text-transform: uppercase;
}

.topic_type {
	color: #87bdd8;
}


/**********************************************/
/*************** colours.css ******************/
/**********************************************/
html, body {
	color: rgba(0,0,0,.4);
    background-color: #ECF0F1;
	background-image: url("./images/bg.gif");
}

h3 {
	border-bottom-color: transparent;
}

a:hover { color: #aa0000; }
a:focus, a:active { color: #105289; }


.headerbar {
	background: #505C65;
}

.navbar {
	background-color: transparent;
}
.navbar-header-top {
    background-color: #2D3039;
	position: sticky;
    top: 0;
    z-index: 1;
}

.navbar-header-top a { color: #CCCCCC; }
.navbar-header-top a:hover { color: #aa0000; }

.dropdown-contents a { color: #676767; }
.dropdown-contents a:hover { color: #aa0000; }

.navbar-header-top .dropdown-trigger.dropdown-toggle .username-coloured {
    color: #CCCCCC !important;
}

ul.forums {
    background: rgba(0,0,0,.025);
}

ul.topiclist dd {
	border-left-color: #FFFFFF;
}

.rtl ul.topiclist dd {
	border-right-color: #FFFFFF;
	border-left-color: transparent;
}

li.row {
	border-color: #e9f1f8;
	background: #FFFFFF;
}

ul.topiclist li {
	 color: rgba(0,0,0,.4);
}

ul.topiclist li.row:first-child {
    border-top-color: #e9f1f8;
}

li.row strong {
	color: #000000;
}

li.row:hover {
	background-color: #f8fcff;
}

li.row:hover dd {
	border-left-color: #F5F5F5;
}

.rtl li.row:hover dd {
	border-right-color: #CCCCCC;
	border-left-color: transparent;
}

li.header, thead {
   background: linear-gradient(to right, #69c 3%, #8a1737 100%);
}

li.header dl.row-item {
   background: linear-gradient(to right, #69c 3%, #8a1737 100%);
}

li.header dt, li.header dd {
	color: #FFFFFF;
}

p.post-notice {
	background-color: #ECD5D8;
	background-image: none;
	border-color: #BC2A4D;
}

ul.navlinks {
	border-top-color: transparent;
}

li.row {
	border-top-color:  transparent;
	margin-bottom: 0px !important;
}

li.row:hover {
	background-color: #F5F5F5;
}

.online {
    background-image: none;
    border-right: 5px solid #01AC00;
}

.offline {
    border-right: 5px solid #FF0000;
}

.pagination li.active span {
	background: #60889B;
	border-color: #60889B;
}

.pagination li a:hover, .pagination li a:hover .icon, .pagination .dropdown-visible a.dropdown-trigger, .nojs .pagination .dropdown-container:hover a.dropdown-trigger {
	background: #60889B;
	border-color: #60889B;
}

select {
	border-color: #666666;
	background-color: #FAFAFA;
	color: #000;
	padding: 7px;
}

div.rules {
	background-color: #ECF1F3;
	color: #BC2A4D;
}

/* ------- Jumpbox ------- */
.jumpbox-cat-link {
	background: linear-gradient(to right, #69c 3%, #7a1732 100%);
	border-top-color: #83C4D6;
}

.jumpbox-cat-link span  {
color: #ffffff;
}

.jumpbox-sub-link {
	background-color: #FFFFFF;
}

.jumpbox-sub-link:hover {
		background-color: #ECF0F1;
}

/* ------- Post signature ------- */
.signature {
	border-top-color: #ECF0F1;
}

/* ------- Footer Bars ------- */
.copyright {
	background-color: #1D1F25;
	color: #A4A4A7;
}

body.high_contrast_links .navbar_footer a,
body.high_contrast_links .copyright_bar a {
	color: #CCCCCC !important;
}

.footer-row a { color: #CCCCCC; }
.navbar-footer {
	background-color: #2D3039;
}

.navbar-footer a { color: #CCCCCC; }
.navbar-footer a:hover { color: #aa0000; }

.navbar-footer .dropdown-contents a { color: #676767; }
.navbar-footer .dropdown-contents a:hover { color: #aa0000; }

/* ------- Table styles ------- */

table.table1 tbody tr:hover, table.table1 tbody tr.hover {
	background-color: #F5F5F5;
	color: #000;
}

/* ------- Forum & Topic Icons (Pulsing ------- */
dl.row-item {
    background-image: none;
}

.forums .row-item:before, .topics .row-item:before, .pmlist .row-item:before, .cplist .row-item:before {
	font-family: FontAwesome;
	text-align: center;
	position: absolute;
	top: 50%;
	left: 0;
	margin-top: -15px;
	margin-left: 9px;
	width: 32px;
	height: 32px;
	line-height: 32px;
	border-radius: 50%;
    background: #87bdd8;
	color: #FFF;
	font-size: 16px;
}

/* Adjustments for weirdly sized icons */
/* Nudge the speech bubble up a few pixels */
.topic_read:before, .topic_read_mine:before, .topic_read_hot:before, .topic_read_hot_mine:before, .topic_unread:before, .topic_unread_mine:before, .topic_unread_hot:before, .topic_unread_hot_mine:before {
	line-height: 28px !important;
}

/* ------- External link left and down ------- */
.forum_link:before {
	line-height: 0 !important;
	width: 30px !important;
	height: 15px !important;
	padding: 16px 0 1px 2px;
}

/* ------- Set the icons ------- */
                    						/* Megaphone */
.global_read:before							{content: "\f0a1";}
.global_read_mine:before					{content: "\f0a1";}
.global_read_locked:before					{content: "\f0a1";}
.global_read_locked_mine:before				{content: "\f0a1";}
.global_unread:before						{content: "\f0a1";}
.global_unread_mine:before					{content: "\f0a1";}
.global_unread_locked:before				{content: "\f0a1";}
.global_unread_locked_mine:before			{content: "\f0a1";}
                                            /* Megaphone */
.announce_read:before						{content: "\f0a1";}
.announce_read_mine:before					{content: "\f0a1";}
.announce_read_locked:before				{content: "\f0a1";}
.announce_read_locked_mine:before			{content: "\f0a1";}
.announce_unread:before						{content: "\f0a1";}
.announce_unread_mine:before				{content: "\f0a1";}
.announce_unread_locked:before				{content: "\f0a1";}
.announce_unread_locked_mine:before			{content: "\f0a1";}
											/* External link */
.forum_link:before							{content: "\f08e";}
											/* Speech Bubble */
.forum_read:before							{content: "\f03a";}
.forum_read_subforum:before					{content: "\f03a";}
.forum_unread:before						{content: "\f03a";}
.forum_unread_subforum:before				{content: "\f03a";}
											/* Pin */
.sticky_read:before							{content: "\f08d";}
.sticky_read_mine:before					{content: "\f08d";}
.sticky_read_locked:before					{content: "\f08d";}
.sticky_read_locked_mine:before				{content: "\f08d";}
.sticky_unread:before						{content: "\f08d";}
.sticky_unread_mine:before					{content: "\f08d";}
.sticky_unread_locked:before				{content: "\f08d";}
.sticky_unread_locked_mine:before			{content: "\f08d";}
											/* Right arrow */
.topic_moved:before							{content: "\f061";}
											/* Envelope */
.pm_read:before 							{content: "\f2b6";}
.pm_unread:before 							{content: "\f0e0";}
											/* Speech Bubble */
.topic_read:before							{content: "\f086";}
.topic_read_mine:before						{content: "\f086";}
.topic_read_hot:before						{content: "\f086";}
.topic_read_hot_mine:before					{content: "\f086";}
.topic_unread:before						{content: "\f086";}
.topic_unread_mine:before					{content: "\f086";}
.topic_unread_hot:before					{content: "\f086";}
.topic_unread_hot_mine:before				{content: "\f086";}
											/* Padlock */
.forum_read_locked:before					{content: "\f023";}
.forum_unread_locked:before					{content: "\f023";}
.topic_read_locked:before					{content: "\f00d";}
.topic_read_locked_mine:before				{content: "\f00d";}
.topic_unread_locked:before					{content: "\f00d";}
.topic_unread_locked_mine:before			{content: "\f00d";}

/* ------- Unread States ------- */
.global_unread:before, .global_unread_mine:before, .global_unread_locked:before, .global_unread_locked_mine:before, .announce_unread:before, .announce_unread_mine:before, .announce_unread_locked:before, .announce_unread_locked_mine:before, .forum_unread:before, .forum_unread_locked:before, .forum_unread_subforum:before, .sticky_unread:before, .sticky_unread_mine:before, .sticky_unread_locked:before, .sticky_unread_locked_mine:before, .pm_unread:before, .topic_unread:before, .topic_unread_mine:before, .topic_unread_hot:before, .topic_unread_hot_mine:before, .topic_unread_locked:before, .topic_unread_locked_mine:before {
	background-color: #d41142 !important;
}

.global_unread:before, .global_unread_mine:before, .global_unread_locked:before, .global_unread_locked_mine:before, .announce_unread:before, .announce_unread_mine:before, .announce_unread_locked:before, .announce_unread_locked_mine:before, .forum_unread:before, .forum_unread_locked:before, .forum_unread_subforum:before, .sticky_unread:before, .sticky_unread_mine:before, .sticky_unread_locked:before, .sticky_unread_locked_mine:before, .pm_unread:before, .topic_unread:before, .topic_unread_mine:before, .topic_unread_hot:before, .topic_unread_hot_mine:before, .topic_unread_locked:before, .topic_unread_locked_mine:before {
	animation: UnreadPulse 3s infinite;
	color: #FFF;
}

/* ------- Forum button styles ------- */
a.button1, input.button1, input.button3, a.button2, input.button2 {
    padding: 7px 12px;
}

/* ------- Box shadow unread pulse icons ------- */
@-webkit-keyframes UnreadPulse {
	0% {
	  -webkit-box-shadow: 0 0 0 0 rgba(233,64,47,0.4);
	}
	70% {
		-webkit-box-shadow: 0 0 0 8px rgba(233,64,47,0);
	}
	100% {
		-webkit-box-shadow: 0 0 0 0 rgba(233,64,47,0);
	}
}
@keyframes UnreadPulse {
	0% {
	  -moz-box-shadow: 0 0 0 0 rgba(233,64,47,0.4);
	  box-shadow: 0 0 0 0 rgba(233,64,47,0.4);
	}
	70% {
		-moz-box-shadow: 0 0 0 8px rgba(233,64,47,0);
		box-shadow: 0 0 0 8px rgba(233,64,47, 0);
	}
	100% {
		-moz-box-shadow: 0 0 0 0 rgba(233,64,47,0);
		box-shadow: 0 0 0 0 rgba(233,64,47,0);
	}
}

/* ------- Gekleurde profielvelden ------- */
.section-viewtopic dl.postprofile dd.profile-posts a, .section-viewtopic dd.profile-posts strong,
.section-viewtopic dd.profile-gender, .section-viewtopic dd.profile-gender strong,
.section-viewtopic dd.profile-startgewicht, .section-viewtopic dd.profile-startgewicht strong {
    color: #EF5350;
}

.section-viewtopic dd.profile-joined, .section-viewtopic dd.profile-joined strong,
.section-viewtopic dd.profile-streefgewicht, .section-viewtopic dd.profile-streefgewicht strong {
    color: #0080FF;
}

.section-viewtopic dd.profile-phpbb_location, .section-viewtopic dd.profile-phpbb_location strong,
.section-viewtopic dd.profile-contact, .section-viewtopic dd.profile-contact strong {
    color: #00A690;
}

.section-viewtopic dd.profile-leeftijd, .section-viewtopic dd.profile-leeftijd strong {
    color: #FF9900;
}

.section-viewtopic dd.profile-flag, .section-viewtopic dd.profile-flag strong {

    color: #4dffff;
}

.section-viewtopic dd.profile-huidig_gewicht, .section-viewtopic dd.profile-huidig_gewicht strong  {
    color: #CC6600;
}

/* ------- Buttons ------- */
a.button:not(.button-icon-only):not([class*="search"]),
a.button1, input.button1, a.button2, input.button2, input.button3 {
	color: #fff;
	background: #79AAC2;
	border-color: #79AAC2;
}

a.button:not(.button-icon-only):not([class*="search"]):hover,
a.button:not(.button-icon-only):not([class*="search"]):focus,
a.button1:hover, input.button1:hover, a.button2:hover, input.button2:hover, input.button3:hover,
a.button1:focus, input.button1:focus, a.button2:focus, input.button2:focus, input.button3:focus {
	color: #fff;
	background: #60889B;
	border-color:  #60889B;
	text-shadow: none;
}

a.button:not(.button-icon-only):not([class*="search"]) i,
a.button:not(.button-icon-only):not([class*="search"]):hover i {
	color: #fff;
}

.button2[name="not_agreed"],
a.lock-btn:not(.button-icon-only):not([class*="search"]) {
	color: #fff;
	background: #d41142;
	border-color: #d41142;
}
	
.button2[name="not_agreed"]:hover,
.button2[name="not_agreed"]:focus,
a.lock-btn:not(.button-icon-only):not([class*="search"]):hover,
a.lock-btn:not(.button-icon-only):not([class*="search"]):focus {
	background: #be0f3b;
	border-color: #be0f3b;
}

/* ------- Input field styles ------- */
.inputbox:hover {
	border-color: #79AAC2;
}

.inputbox:focus {
	border-color: #79AAC2;
}
/* ------- Colours and backgrounds for buttons.css ------- */
.button .icon,
.button-secondary {
	color: #79AAC2;
}

/* ------- Main CP box ------- */
.panel-container .panel li.header dd, .panel-container .panel li.header dt, .panel-container table.table1 thead th {
	color: #FFFFFF;
}

/* ------- CP tapped menu ------- */
.tabs .tab > a {
	background: #F5F7FA;
	color: #536482;
}

.tabs .tab > a:hover {
	background: #ECF3F7;
	color: #D31141;
}

.tabs .activetab > a,
.tabs .activetab > a:hover {
  	background-color: #FBFBFF;
	color: #D31141;
}

/**********************************************/
/************** cp.css ************************/
/**********************************************/

/* ------- CP tapped menu ------- */
.tabs .tab > a {
	border: 1px solid transparent;
	border-radius: 0px;
	margin: 1px 1px 0 0;
}


/**********************************************/
/************** responsive.css ****************/
/**********************************************/
@media (max-width: 430px) {
	.action-bar .search-box .inputbox {
		width: 57px;
    }
}

@media (max-width: 700px) {
    .topic-poster {
        display: block !important;
    }

    .navbar-header-top {
	    margin-bottom: 0;
    }

    .headerbar + .navbar {
		margin-top: -8px;
	}

    li.header dt {
	    font-size: 1.4em;
	}
	
    .navbar-footer {
	    margin-top: -2px;
    }

    .post .postprofile {
		text-align: left;
    }

    .postprofile .avatar {
		margin-left:  0 !important;
		margin-bottom: 0.5em;
	}

    .post.online .postprofile {
		background-size: 40px;
	}

    .phpbb_alert {
		top: 150px;
	}

    .section-viewforum .forumbg .row-item .list-inner {
        display: flex;
        flex-direction: column;
    }

    .section-viewforum .forumbg .row-item .list-inner > *:first-child {
        order: 1;
    }
    .section-viewforum .forumbg .row-item .list-inner > *:nth-child(4) {
        order: 2;
    }
    .section-viewforum .forumbg .row-item .list-inner > *:nth-child(3) {
        order: 3;
    }
    .section-viewforum .forumbg .row-item .list-inner > *:nth-child(2) {
        order: 4;
    }
    .section-viewforum .forumbg .row-item .list-inner > *:nth-child(5) {
        order: 5;
    }
}
@media (min-width: 701px) and (max-width: 950px) {

	ul.topiclist dt {
    	margin-right: -410px;
	}

	ul.topiclist dt .list-inner {
    	margin-right: 410px;
	}

	dd.posts, dd.topics, dd.views {
    	width: 80px;
	}
}
@media (min-width: 701px) {
    form#login {
        display: flex;
        flex-wrap: wrap;
    }
    form#login .panel {
        flex: 1;
        width: 50%;
    }
    form#login .panel:first-child {
        margin-right: 2px;
    }   
    form#login .panel:last-child {
        margin-left: 2px;
    }
    form#login .panel dd label {
        white-space: normal;
    }
}
@media (min-width: 701px) {
    li.header dl.row-item dt .list-inner {
	/* Tweak for headers alignment when folder icon used */
	    padding-left: 15px;
	    padding-right: 50px;
    }
}
Last edited by Mick on Tue Nov 01, 2022 7:20 am, edited 1 time in total.
Reason: Solved.
User avatar
Mannix_
Registered User
Posts: 1838
Joined: Sun Oct 25, 2015 2:56 pm
Name: Matt
Contact:

Re: Sequence css changes

Post by Mannix_ »

It does matter the browser read the css files from top to bottom.

So f.e if you have a {color: red} on line 3 and you add a{ color: blue} on line 10 the anchor would be blue.

The browser uses them both but since blue is lower in the file it will win the battle for which color the browser should use for the anchors. Of course there is !important that you can add on line 3 that would negate that and red color would have priority but that is another can of worms you don't want to open :D .
Did I helped You? Consider a donation.
New version of phpBB has been released? My styles aren't validated for it yet? Check my page for the latest downloads!
User avatar
cabot
Registered User
Posts: 689
Joined: Sat Jan 07, 2012 4:16 pm
Contact:

Re: Sequence css changes

Post by cabot »

Hello,

If you declare the same property twice with a different value on the same selector, the last value will be applied.

Code: Select all

foo {
	color: black;
}

foo {
	color: red;
}
=> foo will be red

Then there is the specificity of the selectors that comes into play.
Ex:

Code: Select all

parent foo {
	color: black;
}

foo {
	color: red;
}
=> foo will be black

Edit: Too slow to answer ^^
User avatar
bennybernaer
Registered User
Posts: 599
Joined: Tue Mar 22, 2011 9:53 pm
Contact:

Re: Sequence css changes

Post by bennybernaer »

Clear! Thanks guys!
User avatar
Mick
Support Team Member
Support Team Member
Posts: 26502
Joined: Fri Aug 29, 2008 9:49 am

Re: Sequence css changes

Post by Mick »

Question: Isn’t it bad practice to use the same property twice?
  • "The more connected we get the more alone we become" - Kyle Broflovski©
  • "The good news is hell is just the product of a morbid human imagination.
    The bad news is, whatever humans can imagine, they can usually create.
    " - Harmony Cobel
User avatar
cabot
Registered User
Posts: 689
Joined: Sat Jan 07, 2012 4:16 pm
Contact:

Re: Sequence css changes

Post by cabot »

This is not recommended on the same selector because it overloads the properties unnecessarily.
User avatar
Gumboots
Registered User
Posts: 692
Joined: Fri Oct 11, 2019 1:59 am

Re: Sequence css changes

Post by Gumboots »

Mick wrote: Tue Nov 01, 2022 7:36 am Question: Isn’t it bad practice to use the same property twice?
How do you mean? It's pretty common for generic classes to be declared, and then have more specific cases (that include those classes) declared later. That's one of the points of using classes as opposed to id's.
🇺🇦 Слава Україні! 🇺🇦 Героям слава! 🇺🇦
User avatar
Mick
Support Team Member
Support Team Member
Posts: 26502
Joined: Fri Aug 29, 2008 9:49 am

Re: Sequence css changes

Post by Mick »

I was just asking that’s all.
  • "The more connected we get the more alone we become" - Kyle Broflovski©
  • "The good news is hell is just the product of a morbid human imagination.
    The bad news is, whatever humans can imagine, they can usually create.
    " - Harmony Cobel
Post Reply

Return to “[3.3.x] Styles Support & Discussion”