General HTML/Web Design Programming Q`s/Image help


QUESTION: I did it some what.

I got my Text to go to the Right of my Image. And then go right down the Right side of the image.

And my Image shows up ok.

Mut my Text starts at the Top Right side of the image but not at the very Top side of the Image why?

It would say it starts 2 lines down and Ends 2 lines down from the Image?

But it still is on the Right side of the Image

This is my Code
<img src="Robert.jpg" align="Left" height="25%">I type here.

Is there any way to get my Code to work?

I did it before thanks?

ANSWER: Try display:block for your image
try display: inline-block
Try text-align: right;

Try usigng position: position: absolute;
         right: 0px;
         width: 300px;
         border: 3px solid #73AD21;
         padding: 10px;
This will get your text to be at 0px from the right side of your page or div. Play with positionning and see if it solves your problem.

Try using float for your text:
         float: right;
         width: 300px;
         padding: 10px;
Try using float left on your image instead of align.

Good luck

---------- FOLLOW-UP ----------

QUESTION: What did you meen by
display:block for your image?

What is this and how do I use it?

The display property specifies if/how an element is displayed.

Every HTML element has a default display value depending on what type of element it is. The default display value for most elements is block or inline.

A block-level element always starts on a new line and takes up the full width available (stretches out to the left and right as far as it can).
Block-level elements:
   <h1> - <h6>

An inline element does not start on a new line and only takes up as much width as necessary

Inline elements:

Every element has a default display value. However, you can override this.

   li {
   display: inline;
   a {
   display: block;

Also, for your information:
Hiding an element can be done by setting the display property to none. The element will be hidden, and the page will be displayed as if the element is not there: h1 {
         display: none;
visibility:hidden; also hides an element.

However, the element will still take up the same space as before. The element will be hidden, but still affect the layout:  

General HTML/Web Design Programming Q`s

All Answers

Answers by Expert:

Ask Experts


Gaston Michel Côté


Anything related to web design, gamification, color psychology, and ELearning. Codes: HTML5, CSS3.


Three years as a web consultant and designer


College Education Certificate in Multimedia Productions

©2017 All rights reserved.