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

              
                <html lang="en">
<div id=main>
<head>
	<title id=title>Imran Khan</title>
	<meta name="viewport" content="width=device-width, initial-scale=1">

	<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>

	<!-- Latest compiled and minified JavaScript -->
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>

	<!-- Latest compiled and minified CSS -->
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">

	<!-- Optional theme -->
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">

	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
</head>

<body>
  <div id="parent">
  <div id=img-div >
    <div id="img-caption">
            <p>Imran Khan</p>
            </div>
				<img id=image src="http://newsbeat.pk/uploads/articles/efa27445.jpg"></img>
          
    </div>
  </div>
	<div class="container">
		<div class="mainJumbo jumbotron col-md-12">
        
        
     <div id=quote>
				<blockquote class="col-md-6">
					<p class="quoteText text-center"><i class="fa fa-quote-left"></i>It is not defeat that destroys you,it is being demoralized by defeat that destroy you<i class="fa fa-quote-right"></i></p>
					<footer>Imran Khan</footer>
				</blockquote>
       <div>
			</div>
		</div>
		<div class="col-md-12">
			<hr>
			<h1 class="text-center">
       <a id="tribute-link" href="" target="_blank"> " A B O U T " </a></h1> 
			<hr>
			<p class="text-justify" id="tribute-info">
				<b>Imran Ahmed Khan</b> (Urdu: عمران احمد خان نیازی‬; born 5 October 1952)[9] is a Pakistani politician and former cricketer who is the 22nd[n 1] and current Prime Minister of Pakistan. He is also the chairman of the Pakistan Tehreek-e-Insaf. Previously he was a member of the National Assembly of Pakistan from 2002 to 2007, and again from 2013 to 2018. Prior to entering politics, Khan was a cricketer and philanthropist. He played international cricket for two decades, and later developed philanthropic projects such as the Shaukat Khanum Memorial Cancer Hospital & Research Centre and Namal College
			</p>
			<p class="text-justify">
				Khan was born to an upper-middle class Pashtun family in Lahore, Punjab, in 1952; he was educated at Aitchison College in Lahore, then the Royal Grammar School Worcester in Worcester, England, and later at Keble College, Oxford. He started playing cricket at the age of 13. Initially playing for his college and later for Worcestershire, Khan made his debut for the Pakistan national cricket team at the age of 18, during the 1971 series against England at Edgbaston, Birmingham. After graduating from Oxford, he made his home debut for Pakistan in 1976, and played until 1992. He also served as the team's captain intermittently between 1982 and 1992.[17] Notably, he led Pakistan to victory at the 1992 Cricket World Cup, Pakistan's first and only victory in that competition
			</p>
			<p class="text-justify">
				Khan retired from cricket in 1992, as one of Pakistan's most successful players. In total he made 3,807 runs and took 362 wickets in Test cricket, and is one of eight world cricketers to have achieved an 'All-rounder's Triple' in Test matches.[19] He was later, in 2010, inducted into the ICC Cricket Hall of Fame. In 1991, he launched a fundraising campaign to set up a cancer hospital in memory of his mother. He raised $25 million to set up a hospital in Lahore in 1994, and later in 2015 a second hospital in Peshawar.[20] Khan remains a prominent philanthropist and commentator, and served as the chancellor of Bradford University between 2005 and 2014 and was the recipient of an honorary fellowship by the Royal College of Physicians in 2012
			</p>
			
		</div>
<br><br>
		

		
			<cite>All information has been provided by <a href="https://en.wikipedia.org/wiki/Imran_Khan">Wikipedia</a> 
</cite>
		
	</div>

</body>
  </div>
</html>
              
            
!

CSS

              
                .quoteText {
	padding-top: 170px;
}
#img-caption p
{
  font-size: 46px; 
  Text-align:center;
  margin-bottom: 30px;
}
#parent
{
   width: auto;
    height: auto;
    max-width: 700px;
  margin:0 auto;
}
#img-div {
    width: auto;
    height: auto;
    max-width: 700px;
  margin:0 auto;
}

#image {
    width: 100%;
height: auto;
max-width: 625px;
margin-left: auto;
margin-right: auto;
display: block;
border: 2px solid green;
    border-radius: 25px;
  
}


.divider {
	color: black;
}

.mainJumbo {
	margin-top: 20px;
}

.middleImg {
	padding: 80px;
}
i
{
  text-align:center;
}
              
            
!

JS

              
                
              
            
!
999px

Console