How to create form in Drupal 7 - php

Question

I want to create a form in Drupal 7 similar to what it is in the following link : https://bmicalculator.cc/?gclid=CIrvnaXv1MQCFQwnjgodvWgAlQ
Form should start with text "BMI Calculator", then 2 columns similar in link and then note text similar to "BMI can be inaccurate for people..."
I know little bit Drupal Form Api so that I can create form but how to display text at the top, how to create form in 2 columns and then again text after form.
I am new to Drupal and hence don't have deep understanding of how drupal works.

Answer 1

To display the text at top, use the #markup item in the form render array. You can then embed the html that you need in this markup.
For the two columns, use the #container type in your form render array. This allows you to wrap a <div> around the child elements. You can then float the div as needed.
So an example would be
$form = array(
/*
* ... form header info here
*/
'header' => array(
'#markup'=>'<h1> BMI Calc </h1>',
),
'col1'=>array(
'#type'=>'container',
'subitemA'=>array(
//some stuff
),
'subitemB'=>array(
//some stuff
),
'#attributes' => array(
'class' => array('class-name'), //use css to float left
//alternatively float left using style in this area
),
),
'col2'=>array(
'#type'=>'container',
'subitemA'=>array(
//some stuff
),
'subitemB'=>array(
//some stuff
),
'#attributes' => array(
'class' => array('class-name'), //use css to float left
//alternatively float left using style in this area
//NOTE: still float left, the divs will align as two columns unless
//screen space is too small, then it will stack responsively.
),
),
);
Hope this helps.