+ 3

How can I align an image in html5?

I'm working on a project on my pc using html5, and I wanna align an image to the center but html5 doesn't support the <img> tag, so how can I align the image to the center by using css perhaps or something in html5 maybe.

css htlm5

26th Nov 2018, 3:45 PM

Christiaan Strydom

9 Answers

+ 8

Here is w3schools example <!DOCTYPE html> <html> <body> <h1>The img align attribute</h1> <p><strong>Note:</strong> The align attribute is not supported in HTML5. Use CSS instead!</p> <h2>align="bottom" (default):</h2> <p>This is some text. <img src="smiley.gif" alt="Smiley face" width="42" height="42"> This is some text.</p> <h2>align="middle":</h2> <p>This is some text. <img src="smiley.gif" alt="Smiley face" width="42" height="42" align="middle"> This is some text.</p> <h2>align="top":</h2> <p>This is some text. <img src="smiley.gif" alt="Smiley face" width="42" height="42" align="top"> This is some text.</p> <h2>align="right":</h2> <p>This is some text. <img src="smiley.gif" alt="Smiley face" width="42" height="42" align="right"> This is some text.</p> <h2>align="left":</h2> <p>This is some text. <img src="smiley.gif" alt="Smiley face" width="42" height="42" align="left"> This is some text.</p> </body> </html> this uses CSS to align

26th Nov 2018, 6:40 PM

BroFar

+ 12

<p><img src="cat.jpg" alt="cat"></p> p{ text-align: center; } (text-align: left; or right)

26th Nov 2018, 7:04 PM

Женечка

+ 7

Hope this helps: https://youtu.be/7BAG-h2f9kA

26th Nov 2018, 7:18 PM

Mitali

+ 3

valid HTML5 code: <style> .center { text-align: center; } </style> <div class="center"> <img src="/path/to/image.ext" alt="alt_text"> </div>

26th Nov 2018, 3:54 PM

Az.

+ 3

<!DOCTYPE html> <html> <body> <h1>The img align attribute</h1> <p><strong>Note:</strong> The align attribute is not supported in HTML5. Use CSS instead!</p> <h2>align="bottom" (default):</h2> <p>This is some text. <img src="smiley.gif" alt="Smiley face" width="42" height="42"> This is some text.</p> <h2>align="middle":</h2> <p>This is some text. <img src="smiley.gif" alt="Smiley face" width="42" height="42" align="middle"> This is some text.</p> <h2>align="top":</h2> <p>This is some text. <img src="smiley.gif" alt="Smiley face" width="42" height="42" align="top"> This is some text.</p>

27th Nov 2018, 2:12 PM

George O Odhiambo

+ 2

Use it inside the p tag

14th Dec 2018, 9:59 PM

Me&You

+ 1

Yes thanks I played around and I remembered the <div> tag and that you can give it properties in html itself <div align="center"> <img src="blah" /> </div>

26th Nov 2018, 4:44 PM

Christiaan Strydom

And thanks for answering

26th Nov 2018, 4:45 PM

Christiaan Strydom

Yes I discovered that yesterday just before doing the <div> thing. I just haven't gotten that far in CSS yet but once my exams are over, which is today, I'll try completing the CSS course.

27th Nov 2018, 4:47 AM

Christiaan Strydom