- Trending Categories
Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Physics
Chemistry
Biology
Mathematics
English
Economics
Psychology
Social Studies
Fashion Studies
Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
Align HTML5 SVG to the center of the screen
SVG stands for Scalable Vector Graphics and it is a language for describing 2D-graphics and graphical applications in XML and the XML is then rendered by an SVG viewer.
Example
Let us see an example of SVG −
<!DOCTYPE html>
<html>
<head>
<style>
#svgelem {
position: relative;
left: 50%;
-webkit-transform: translateX(-20%);
-ms-transform: translateX(-20%);
transform: translateX(-20%);
}
</style>
<title>SVG</title>
<meta charset="utf-8" />
</head>
<body>
<h2>HTML5 SVG Circle</h2>
<svg id = "svgelem" height = "200" xmlns = "http://www.w3.org/2000/svg">
<circle id = "redcircle" cx = "50" cy = "50" r = "50" fill = "red" />
</svg>
</body>
</html>To center it, add the CSS like the following −
# svgelem {
margin-left:auto;
margin-right:auto;
display:block;
}
- Related Articles
- Positioning HTML5 SVG in the center of screen
- How to Align the modal content box to the center of any screen?
- Align flex items in the center on different screen sizes in Bootstrap
- How to align block elements to the center?
- How to center align the items of a JComboBox in Java?
- How to align views at the bottom of the screen in iOS
- How to align views at the bottom of the screen in Android?
- Align flex items at the center of the container with CSS
- How to draw SVG Logo in HTML5?
- How to use SVG images in HTML5?
- Center image using text-align center with CSS?
- What is the difference between SVG and HTML5 Canvas?
- How to center a div on the screen using jQuery?
- How to center a window on the screen in Tkinter?
- How to display a JFrame to the center of a screen in Java?
Advertisements