Xidipity

Knowledge Base

border
Framework: Border
Xidipity WordPress Theme Knowledge Base Framework Content Header Image
Dashed line
all thin width
 
  • class: bdr:da-1x
  • css: border-style: dashed;
  •   border-width: thin;

 

all medium width
 
  • class: bdr:da-2x
  • css: border-style: dashed;
  •   border-width: medium;

 

all thick width
 
  • class: bdr:da-3x
  • css: border-style: dashed;
  •   border-width: thick;

 

bottom thin width
 
  • class: bdr:bt-da-1x
  • css: border-bottom-style: dashed;
  •   border-bottom-width: thin;

 

bottom medium width
 
  • class: bdr:bt-da-2x
  • css: border-bottom-style: dashed;
  •   border-bottom-width: medium;

 

bottom thick width
 
  • class: bdr:bt-da-3x
  • css: border-bottom-style: dashed;
  •   border-bottom-width: thick;

 

left thin width
 
  • class: bdr:lt-da-1x
  • css: border-left-style: dashed;
  •   border-left-width: thin;

 

left medium width
 
  • class: bdr:lt-da-2x
  • css: border-left-style: dashed;
  •   border-left-width: medium;

 

left thick width
 
  • class: bdr:lt-da-3x
  • css: border-left-style: dashed;
  •   border-left-width: thick;

 

right thin width
 
  • class: bdr:rt-da-1x
  • css: border-right-style: dashed;
  •   border-right-width: thin;

 

right medium width
 
  • class: bdr:rt-da-2x
  • css: border-right-style: dashed;
  •   border-right-width: medium;

 

right thick width
 
  • class: bdr:rt-da-3x
  • css: border-right-style: dashed;
  •   border-right-width: thick;

 

top thin width
 
  • class: bdr:tp-da-1x
  • css: border-top-style: dashed;
  •   border-top-width: thin;

 

top medium width
 
  • class: bdr:tp-da-2x
  • css: border-top-style: dashed;
  •   border-top-width: medium;

 

top thick width
 
  • class: bdr:tp-da-3x
  • css: border-top-style: dashed;
  •   border-top-width: thick;

 

Dotted line
all thin width
 
  • class: bdr:do-1x
  • css: border-style: dotted;
  •   border-width: thin;

 

all medium width
 
  • class: bdr:do-2x
  • css: border-style: dotted;
  •   border-width: medium;

 

all thick width
 
  • class: bdr:do-3x
  • css: border-style: dotted;
  •   border-width: thick;

 

bottom thin width
 
  • class: bdr:bt-do-1x
  • css: border-bottom-style: dotted;
  •   border-bottom-width: thin;

 

bottom medium width
 
  • class: bdr:bt-do-2x
  • css: border-bottom-style: dotted;
  •   border-bottom-width: medium;

 

bottom thick width
 
  • class: bdr:bt-do-3x
  • css: border-bottom-style: dotted;
  •   border-bottom-width: thick;

 

left thin width
 
  • class: bdr:lt-do-1x
  • css: border-left-style: dotted;
  •   border-left-width: thin;

 

left medium width
 
  • class: bdr:lt-do-2x
  • css: border-left-style: dotted;
  •   border-left-width: medium;

 

left thick width
 
  • class: bdr:lt-do-3x
  • css: border-left-style: dotted;
  •   border-left-width: thick;

 

right thin width
 
  • class: bdr:rt-do-1x
  • css: border-right-style: dotted;
  •   border-right-width: thin;

 

right medium width
 
  • class: bdr:rt-do-2x
  • css: border-right-style: dotted;
  •   border-right-width: medium;

 

right thick width
 
  • class: bdr:rt-do-3x
  • css: border-right-style: dotted;
  •   border-right-width: thick;

 

top thin width
 
  • class: bdr:tp-do-1x
  • css: border-top-style: dotted;
  •   border-top-width: thin;

 

top medium width
 
  • class: bdr:tp-do-2x
  • css: border-top-style: dotted;
  •   border-top-width: medium;

 

top thick width
 
  • class: bdr:tp-do-3x
  • css: border-top-style: dotted;
  •   border-top-width: thick;

 

Solid line
all thin width
 
  • class: bdr:so-1x
  • css: border-style: solid;
  •   border-width: thin;

 

all medium width
 
  • class: bdr:so-2x
  • css: border-style: solid;
  •   border-width: medium;

 

all thick width
 
  • class: bdr:so-3x
  • css: border-style: solid;
  •   border-width: thick;

 

bottom thin width
 
  • class: bdr:bt-so-1x
  • css: border-bottom-style: solid;
  •   border-bottom-width: thin;

 

bottom medium width
 
  • class: bdr:bt-so-2x
  • css: border-bottom-style: solid;
  •   border-bottom-width: medium;

 

bottom thick width
 
  • class: bdr:bt-so-3x
  • css: border-bottom-style: solid;
  •   border-bottom-width: thick;

 

left thin width
 
  • class: bdr:lt-so-1x
  • css: border-left-style: solid;
  •   border-left-width: thin;

 

left medium width
 
  • class: bdr:lt-so-2x
  • css: border-left-style: solid;
  •   border-left-width: medium;

 

left thick width
 
  • class: bdr:lt-so-3x
  • css: border-left-style: solid;
  •   border-left-width: thick;

 

right thin width
 
  • class: bdr:rt-so-1x
  • css: border-right-style: solid;
  •   border-right-width: thin;

 

right medium width
 
  • class: bdr:rt-so-2x
  • css: border-right-style: solid;
  •   border-right-width: medium;

 

right thick width
 
  • class: bdr:rt-so-3x
  • css: border-right-style: solid;
  •   border-right-width: thick;

 

top thin width
 
  • class: bdr:tp-so-1x
  • css: border-top-style: solid;
  •   border-top-width: thin;

 

top medium width
 
  • class: bdr:tp-so-2x
  • css: border-top-style: solid;
  •   border-top-width: medium;

 

top thick width
 
  • class: bdr:tp-so-3x
  • css: border-top-style: solid;
  •   border-top-width: thick;

 

Abbreviations
 
AbbreviationDefinition
bdrborder
1xthin
2xmedium
3xthick
btbottom
dadashed
dodotted
ltleft
rtright
sosolid
tptop

 

Supported media
 
AbbreviationDefinition
all
sm)small
md)medium
lg)large
xl)extra large
Notes
 

All border classes begin with “bdr” and are separated by a colon from it’s value. Also included in this syntax is border base, primary, and secondary colors (ie. bdr:bas+2).


  • Since: v1.0.0

 

May 20, 2022