anchor.diff:  
   image::img/orderedlayout_horizontal.png[width=80%, scaledwidth=100%]
   
  -[[layout.orderedlayout.properties]]
  -== Properties or Attributes
  -
  -Ordered layouts have the following properties:
  +ifdef::web[]
  +[[layout.orderedlayout.declarative]]
  +== Declarative Format
  +
  +Ordered layouts have the following declarative elements:
  +
  +|===============
  +|Component|Element Name
  +|[classname]#VerticalLayout#|[elementname]#v-verticallayout#
  +|[classname]#HorizontalLayout#|[elementname]#v-horizontallayout#
  +|[classname]#FormLayout#|[elementname]#v-formlayout#
  +|===============
  +
  +The have the following declarative attributes:
   
   [[layout.orderedlayout.properties.table]]
   .Properties and Declarative Attributes
  
positive.code: |[parameter]#spacing#|[parameter]##spacing##++[=++[replaceable]##&lt;boolean&gt;##++]++
  |[parameter]#margin#|[parameter]##margin##++[=++[replaceable]##&lt;boolean&gt;##++]++
  |[parameter]#expandRatio#|Expand ratio of a child component is specified in the child with: [parameter]#:expand#++[=++[replaceable]##&lt;integer&gt;##++]++ or [parameter]#:expand# (implies ratio 1)
  
  |===============
  
  [[layout.orderedlayout.spacing]]
  == Spacing in Ordered Layouts
  
negative.code: 
  Typical use of the layouts goes as follows:
  
  [source, java]
  ----
  VerticalLayout vertical = new VerticalLayout ();
  