Pen Settings

HTML

CSS

CSS Base

Vendor Prefixing

Add External Stylesheets/Pens

Any URL's added here will be added as <link>s in order, and before the CSS in the editor. You can use the CSS from another Pen by using it's URL and the proper URL extention.

+ add another resource

JavaScript

Babel includes JSX processing.

Add External Scripts/Pens

Any URL's added here will be added as <script>s in order, and run before the JavaScript in the editor. You can use the URL of any other Pen and it will include the JavaScript from that Pen.

+ add another resource

Packages

Add Packages

Search for and use JavaScript packages from npm here. By selecting a package, an import statement will be added to the top of the JavaScript editor for this package.

Behavior

Save Automatically?

If active, Pens will autosave every 30 seconds after being saved once.

Auto-Updating Preview

If enabled, the preview panel updates automatically as you code. If disabled, use the "Run" button to update.

Format on Save

If enabled, your code will be formatted when you actively save your Pen. Note: your code becomes un-folded during formatting.

Editor Settings

Code Indentation

Want to change your Syntax Highlighting theme, Fonts and more?

Visit your global Editor Settings.

HTML

              
                <script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script>

<nav></nav>

<!-- Main : START -->

<div id="main">
 
<!-- Hero Section : START -->
      
      <div id="hero">

        <h1 id="title">K. KAMARAJ</h1>
        <p>1903 - 1975</p>

        <div id="img-div">

          <img id="image" src="https://th.thgim.com/migration_catalog/article11233952.ece/ALTERNATES/FREE_960/15TH_KAMARAJ">
          <figcaption id="img-caption">Chief Minister of Madras K. Kamaraj serves ‘kanji’ (rice gruel) to schoolstudents at Sri Devalai’s agricultural farm at Katpadi <br />on October 29, 1954.</figcaption>

        </div>
        
    </div>
  
<!-- Tribute Info : START -->
    
    <ul id="tribute-info">
      
      <h3 class="info-title">Here's a time line of K. Kamaraj life:</h3>
    
      <p class="info-content">Kumaraswami Kamaraj (15 July 1903 – 2 October 1975) was involved in the Indian independence movement. As the president of the INC, he was instrumental in navigating the party after the death of Jawaharlal Nehru. As the chief minister of Madras, he was responsible for bringing free education to the disadvantaged and introduced the free Midday Meal Scheme while he himself did not complete schooling. He was awarded with India's highest civilian honour, the Bharat Ratna, posthumously in 1976.</p>
      
      <li class="content-list">Kamaraj started his career doing odd jobs. He worked at his uncle’s provision shop. It was during this time that Kamaraj developed interest in politics. He was an avid newspaper reader and kept himself updated with the current events. He soon became involved with the political processions and public meetings and acquainted himself with the Indian Home Rule Movement.</li>
      <li class="content-list">The 1919 Jallianwala Bagh Massacre was a turning point in Kamaraj’s life. The killing of innocent people instigated a rage of fury and vehemence in Kamaraj who decided to work actively in India’s struggle for freedom and bring an end to British Raj.</li>
      <li class="content-list">Kamaraj’s growing interest in politics was not supported by his family who sent him to Thiruvananthapuram where his second uncle stayed. However, Kamaraj’s passion for politics could not be curtailed in Thiruvananthapuram as well. He participated in the Vaikom Satyagraha led by George Joseph of the Congress, against the atrocities of the higher caste Hindus on the Harijans. Kamaraj met Mahatma Gandhi, India’s face of freedom struggle, at the Madurai’s Congress meet. He was inspired by the latter’s simplicity and non-violence movement.</li>
      <li class="content-list">His political activities in Thiruvananthapuram annoyed his family to the point that he was called back. Though the elders in the family persuaded Kamaraj to stop getting involved in country’s politics, it was without much result. They even tried to marry him off but Kamaraj resolutely disagreed.</li>
      <li class="content-list">In 1920, he joined Congress as a full time worker. He actively worked as political campaigner, organizing public meetings and carrying the Congress propaganda.</li>
      <li class="content-list">Early in his career as a political activist, he participated in many events as a part of the Non-Violent Movement including the Nagpur Flag Satyagraha, Sword Satyagraha, Neil Statue Satyagraha and so on. After joining the Congress, he participated in almost all agitations and demonstrations against the British rule.</li>
      <li class="content-list">In 1930, Kamaraj participated in the Rajagopalachari-led Salt Satyagraha Movement in Vedaranyam. He was sentenced for two years. However, his term of imprisonment was cut short following the Gandhi-Irwin Pact that led to his release in 1931.</li>
      <li class="content-list">In 1932, despite ban on public meetings and procession in Madras, he led processions and demonstrations which subsequently led to his arrest and one year imprisonment. In 1933, Kamaraj was yet again charged with involvement in the Virudhunagar bomb case. However, he was acquitted after not being found guilty.</li>
      <li class="content-list">In 1936, Kamaraj’s guru Satyamurti was elected President of the Provincial Congress. The latter appointed Kamaraj as the General Secretary. Four years later, the duo swapped positions strengthening the party base through their leadership skills.</li>
      <li class="content-list">In 1942, he attended the All India Congress Meet in Bombay where Gandhi’s Quit India Movement bore its roots. He spread the propaganda material to Trichy, Tanjore, Ranipet and Madurai and for the same was arrested and imprisoned for three years. During his term in jail, he read and self-educated himself.</li>
      <li class="content-list">After India’s independence in 1947 he was elected a member of the Working Committee of the Congress. He was also a member of the Constituent Assembly that drafted the constitution. In 1951 he contested and won a seat in the elections to the first Lok Sabha.</li>
      <li class="content-list">In 1954, he was elected as the Chief Minister of the Madras State. He reluctantly took up the post and nominated his co-contestants C. Subramaniam and M. Bhakthavatsalam in his cabinet. Kamaraj’s motto as Chief Minister was to work for the welfare of the people.</li>
      <li class="content-list">Under Kamaraj, Madras made immense progress in education and trade. New schools were opened and education was made free and compulsory for all up to 11th Standard. Every village had a primary school and every Panchayat a high school. He even introduced the concept of Mid-Day Meal Scheme for lakhs of poor and deprived children. To eradicate caste, creed and class differences, he introduced school uniform. Such was the progress under his administration that the education rate augmented from merely 7% to 37%.</li>
      <li class="content-list">Education was the primary focus of Kamaraj’s Government but he did not overlook other sectors. In fact, he came up with major irrigation schemes that led to the building of dams and canals. Farmers were given facilities and subsidized loans. He also administered the setting up of major industries under his governance such as Neyveli Lignite Corporation, BHEL, Manali Oil Refinery, Hindustan raw photo film factory, surgical instruments factory, a railway coach factory and so on. Industries such as paper, sugar, chemicals and cement were also established during this period.</li>
      <li class="content-list">Kamaraj’s excellence as a leader and administrator was evident from the fact that he remained the Chief Minister of the State for three consecutive terms, being re-elected in 1957 and later in 1962. Under his administration, Nehru claimed Madras to be the ‘best administered state in India’.</li>
      <li class="content-list">In 1963, he resigned from his post of the Chief Minister to serve a greater purpose. Congress which was losing its vigour and shine needed a revamp of sorts. He came up with a plan which was called the ‘Kamaraj Plan’. He proposed that all senior Congress leaders should resign from their post and devote their energy towards revitalization of the Congress. It was mainly done to refrain the leaders from the temptation of power and instead re-commit them to party objectives and motto. The Plan was a major hit as a number of ministers like Lal Bahadur Shastri, Jagjivan Ram, Morarji Desai and S.K. Patil resigned from their posts.</li>
      <li class="content-list">In 1964, he was elected the President of the All India Congress. During his term as the President, he successfully steered the nation through the stormy years post Nehru’s death. He refused to take up Prime Ministerial office twice, giving it to Lal Bahadur Shastri and Indira Gandhi in 1964 and 1966 respectively.</li>
      <li class="content-list">During the 1969 split of Congress, Kamaraj became the leader of the Indian National Congress (Organisation) in Tamil Nadu. However, in 1971 the party failed miserably but he retained his position until his death in 1975.</li>
      <li class="content-list">Though Kamaraj’s role in politics was significant all through, starting off as a political activist and later as the prominent leader of the Indian Independence Movement, his most important contribution came later in his career as the Chief Minister of Madras State. Under his governance, Madras became one of the best administered states of the country. He emphasized on educational reforms, introducing free compulsory education. He established new schools and introduced the concept of midday meal scheme under which lakhs of poor and deprived children were provided food. He also tried to get rid of caste and creed differences. Irrigation and industry also prospered and grew under his three-consecutive term governance.</li>
      
    </ul>
  
  <div id="quote">
      
      <p>Everyone's life does not become history...<br>No one who became history lived for himself!!!</p>
        
  </div>
  
 <!--External Link : START -->
  
  <div id="external-link">
    <p>If you have time, you should read more about this incredible human being on his <a id="tribute-link" href="https://en.wikipedia.org/wiki/K._Kamaraj" target="_blank">Wikipedia entry</a>.</p>
  </div>
 
<!-- External Link : END -->
    
</div>

<!-- Main : END -->
              
            
!

CSS

              
                *{
  margin: 0px;
  padding: 0px;
  text-decoration: none;
}
html{
  font-size: 10px;
}

body{
  background-color: ghostwhite;
  line-height: 1.5;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica Neue", Arial, sans-serif;
}

nav{
  max-width: 100%;
  height: 50px;
}

#main{
  width: 90%;
  margin: auto;
  text-align: center;
}

#hero{
  height: 100%;
  padding: 10px;
}

#img-div{
  padding: 20px 0px;
}

#img-div img{
  display: block;
  max-width: 80%;
  height: auto;
  margin: auto;
}

figcaption{
  font-size: 1.4rem;
  padding: 5px 0px 0px 0px;
}

#tribute-info{
  max-width: 80%;
  height: auto;
  margin: auto;
}

h1{
  font-size: 4rem;
  padding: 5px 0px;
}

h3{
  font-size: 2.5rem;
  padding: 5px 0px;
}

p{
  font-size: 1.7rem;
  padding: 5px 0px;
  line-height: 2;
}

ul{
  margin: 0px 8px;
}
li{
  line-height: 2;
  text-align: justify;
  font-size: 1.7rem;
  padding: 5px 0px;
}

#quote{
  padding: 20px 0px;
}

a{
  background-color: black;
  color: white;
  border-radius: 15px;
  padding: 5px 8px;
}

#external-link{
  padding: 0px 0px 20px 0px;
}
              
            
!

JS

              
                
              
            
!
999px

Console