The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> HTML, images appear side by side in html document
deb1
post Jun 21 2020, 12:00 PM
Post #1


Advanced Member
****

Group: Members
Posts: 109
Joined: 7-May 20
Member No.: 27,330



Hello,
can someone please tell me how to make more than one images appear side by side in a html document ?

This post has been edited by deb1: Jun 21 2020, 12:02 PM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Jun 21 2020, 12:11 PM
Post #2


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,716
Joined: 9-August 06
Member No.: 6



You don't need to do anything at all. Just place them after each other in the source. In a row or one under the other doesn't matter. IMG is an inline (text level) element, so images behave like words on a line. For them not to do so you must have done something, placed them each in a DIV or similar.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
deb1
post Jun 22 2020, 04:40 AM
Post #3


Advanced Member
****

Group: Members
Posts: 109
Joined: 7-May 20
Member No.: 27,330



i don't want it one under the other . i want it side by side .
When i try to do it , it doesn't appear side by side. so can
you please show me the coding where the images can be placed beside each other.
Not one under the other ... if that makes sense at all.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Jun 22 2020, 07:49 AM
Post #4


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,716
Joined: 9-August 06
Member No.: 6



That wasn't what I said. I said you can put the IMG tags one after the other or under each other when you type the HTML. They will show side by side in the browser, just like words. This is because they are inline elements. You have done something that changes that behaviour.

https://htmlhelp.com/reference/html40/inline.html

HTML
<body>

<p>
These words will show side by side and so will the images below.</p>

<img src="https://htmlhelp.com/icon/wdglogo.gif" alt="WDG"> <img src="https://htmlhelp.com/icon/wdglogo.gif" alt="WDG"> <img src="https://htmlhelp.com/icon/wdglogo.gif" alt="WDG">

<p>
So
will
these
words
and
these
images.</p>

<img src="https://htmlhelp.com/icon/wdglogo.gif" alt="WDG">
<img src="https://htmlhelp.com/icon/wdglogo.gif" alt="WDG">
<img src="https://htmlhelp.com/icon/wdglogo.gif" alt="WDG">

</body>



Attached Image
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
deb1
post Jun 22 2020, 11:47 AM
Post #5


Advanced Member
****

Group: Members
Posts: 109
Joined: 7-May 20
Member No.: 27,330



just tried it by myself just now , it worked . so thank you smile.gif
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
2 User(s) are reading this topic (2 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 28th March 2024 - 08:23 AM