how to make a div with a pic...

.... and text is flowing around nicely?

Pic could be left or right or in the center.

Can someone post a sample?

Thanks in advance...

Re: how to make a div with a pic...

In article
<4696e055$0$12852$5a62ac22@per-qv1-newsreader-01.iinet.net.au>,
- <"bgyuobhjo[i"@hotmail.com> wrote:

> ... and text is flowing around nicely?
>
> Pic could be left or right or in the center.
>
> Can someone post a sample?
>
> Thanks in advance...

http://tinyurl.com/2dcgfx

--
dorayme

Re: how to make a div with a pic...

On Jul 12, 10:16 pm, - <"bgyuobhjo[i"@hotmail.com> wrote:
> ... and text is flowing around nicely?
>
> Pic could be left or right or in the center.
>
> Can someone post a sample?
>
> Thanks in advance...

you can use the "align" attribute of the img tag to position the image
left, right or center within the text or
use the float inline style on the img tag to position the image to the
left or right within the text

[text]

[text]

[text]

[text]

Re: how to make a div with a pic...

msuc117@yahoo.com wrote:
> On Jul 12, 10:16 pm, - <"bgyuobhjo[i"@hotmail.com> wrote:
>> ... and text is flowing around nicely?
>>
>> Pic could be left or right or in the center.
>>
>> Can someone post a sample?
>>
>> Thanks in advance...
>
> you can use the "align" attribute of the img tag to position the image
> left, right or center within the text or
> use the float inline style on the img tag to position the image to the
> left or right within the text
>
>

> [text]
>
> [text]
>

Re: how to make a div with a pic...

dorayme wrote:
> In article
> <4696e055$0$12852$5a62ac22@per-qv1-newsreader-01.iinet.net.au>,
> - <"bgyuobhjo[i"@hotmail.com> wrote:
>
>> ... and text is flowing around nicely?
>>
>> Pic could be left or right or in the center.
>>
>> Can someone post a sample?
>>
>> Thanks in advance...
>
> http://tinyurl.com/2dcgfx
>


Basically such line is easiest way to do it!

height="200" width="146">

Many thanks!

Re: how to make a div with a pic...

In article
<469990bb$0$12806$5a62ac22@per-qv1-newsreader-01.iinet.net.au>,
- <"bgyuobhjo[i"@hotmail.com> wrote:

> dorayme wrote:
> > In article
> > <4696e055$0$12852$5a62ac22@per-qv1-newsreader-01.iinet.net.au>,
> > - <"bgyuobhjo[i"@hotmail.com> wrote:
> >
> >> ... and text is flowing around nicely?
> >>
> >> Pic could be left or right or in the center.
> >>
> >> Can someone post a sample?
> >>
> >> Thanks in advance...
> >
> > http://tinyurl.com/2dcgfx
> >
>
>
> Basically such line is easiest way to do it!
>
> > height="200" width="146">
>
> Many thanks!

You remind me to add a couple of px or so padding too to allow
some grace...

--
dorayme

Re: how to make a div with a pic...

Scripsit dorayme:

>>> http://tinyurl.com/2dcgfx
>>
>> Basically such line is easiest way to do it!
>>
>>

This seems to be a quotation from the page mentioned; its real address is
http://members.optushome.com.au/droovies/binHassad/camelSkin Trader.html

>> Many thanks!
>
> You remind me to add a couple of px or so padding too to allow
> some grace...

Well, wouldn't it be simpler to use your favorite image processing program
to add a border to the image itself? Then you would see the bordered image
before putting it onto your page, and you would be reminded, by your own
eyes, about the need to add some padding between the camel and the borders.
This would cost a few bytes in image size, but on the other hand, you would
not need the CSS code for padding and border. Besides, your image would
appear with the border even when CSS is off.

You get 5 minus points for alt="a camel". It results on those silly words
appearing between paragraphs of text, when the image is not displayed, for
one reason or another - i.e., in the situation for which the alt attribute
should be written for! The correct value is alt="" (i.e., empty string). You
are allowed to add title="a camel", if you think that someone who sees the
image might not recognize it as a camel and might accidentally wave his hand
so that the pointer moves over the image (and might actually notice the tiny
"tooltip"). But you are allowed to do this only after reading and
understanding the treatise on alt texts:
http://www.cs.tut.fi/~jkorpela/html/alt.html

--
Jukka K. Korpela ("Yucca")
http://www.cs.tut.fi/~jkorpela/

Re: how to make a div with a pic...

In article ,
"Jukka K. Korpela" wrote:

> Scripsit dorayme:
>
> >>> http://tinyurl.com/2dcgfx

> > You remind me to add a couple of px or so padding too to allow
> > some grace...
>
> Well, wouldn't it be simpler to use your favorite image processing program
> to add a border to the image itself? Then you would see the bordered image
> before putting it onto your page, and you would be reminded, by your own
> eyes, about the need to add some padding between the camel and the borders.
> This would cost a few bytes in image size, but on the other hand, you would
> not need the CSS code for padding and border. Besides, your image would
> appear with the border even when CSS is off.
>

Let us put aside the particular issue of this pic because you
raise an interesting general point with which I both agree and
disagree with in different respects.

The pic of the camel is already possibly the most unimportant pic
in the whole wwc [1]. It has so little going for it that taking
even flexibility from it would be a crime! Which brings me to the
serious issue.

The power of css is such that one can add padding and borders to
things in a most simple way, including pictures. Once you fix
something into a picture, that is it, it loses all practical
flexibility. CSS is for styling. Borders and padding are style
issues. (Perhaps one can manage the css and divs to cut off real
borders with tricks but let us leave such complications aside. In
css it is easier to give than to take away and flexibility is the
topic here).

Let us just concentrate on padding for now to make a point about
trade-offs. If there is no real inbuilt padding, author has
maximum flexibility. He might want no padding for some pages on
which a particular pic appears and lots on another. He might want
it one way on a particular page at one time, but not at another
time. I am sure you understand this.

Now, there is an issue with css being turned off. [2] In this
situation the author is faced with a dilemma, to build a padding
inside the pic as a safety net for such a situation and to
forego, as a direct result, flexibility or to follow the
teachings of our church and to truly separate style from content
and trust to the gods.

Talking about flexibility, I am reminded further, I must turn
that pic into a gif and include transparency and make it even
more flexible.

> You get 5 minus points for alt="a camel". It results on those silly words
> appearing between paragraphs of text,

You have me on that one. (5! Your scale is very severe!) Look,
that page and pic was done before I started taking alt text pills
(which pills were, in turn, made by a chemist who I gave specific
instructions to base them on your writings on this subject).

See my correction at http://tinyurl.com/2dcgfx

-------------
1. wide world of camels

2. Helpfully, IE provides a 3px gap. At least up until recently
this has meant that at least there is a 3px gap on at least one
side for a majority of viewers. This note is to tease Bergamot
who thinks it is a bug.

--
dorayme

Re: how to make a div with a pic...

Scripsit dorayme:

> The power of css is such that one can add padding and borders to
> things in a most simple way, including pictures.

I don't think CSS was really meant for any image processing. It is true that
you can use it for very elementary operations on images

> Once you fix
> something into a picture, that is it, it loses all practical
> flexibility.

Padding and borders are, more or less, part of image design, just like the
colors and the shapes of the image. Surely it is one of the most trivial
parts of image design, but it should not be ignored in image design.

If you are thinking about re-using the same images in different contexts on
different pages, fine. But you should always check, for each use, whether
the image really fits, esthetically and pragmatically. You may need to
modify the image, e.g. resize it, pick up a different part from an original
photograph, or change the colors of a drwawing to fit into a particular
color scheme on a page. This is a job for an image processing program, not
CSS code. The same applies to padding and border.

(Confession: I have sometimes forgotten to add borders in an image
processing program and then "fixed" this using border="1". But I'm not
saying that this was right.)

> CSS is for styling.

Not for styling of images.

> Borders and padding are style issues.

So are colors and shapes in an image.

> Now, there is an issue with css being turned off. [2]
- -
> 2. Helpfully, IE provides a 3px gap.

In Quirks Mode.

> At least up until recently
> this has meant that at least there is a 3px gap on at least one
> side for a majority of viewers.

Some other browsers do some other odd things in Quirks Mode.

--
Jukka K. Korpela ("Yucca")
http://www.cs.tut.fi/~jkorpela/

Re: how to make a div with a pic...

In article <9QImi.192552$lm3.79213@reader1.news.saunalahti.fi>,
"Jukka K. Korpela" wrote:

> Scripsit dorayme:
>
> > The power of css is such that one can add padding and borders to
> > things in a most simple way, including pictures.
>
> I don't think CSS was really meant for any image processing. It is true that
> you can use it for very elementary operations on images
>
> > Once you fix
> > something into a picture, that is it, it loses all practical
> > flexibility.
>
> Padding and borders are, more or less, part of image design, just like the
> colors and the shapes of the image. Surely it is one of the most trivial
> parts of image design, but it should not be ignored in image design.

I both agree with you and not. I have spent about a quarter of my
life worrying about borders and frames and the mounting of my own
photographs and I regard it as part and parcel of the whole show,
very important indeed. But it is not a fruitful question whether
it is part of image design. It is part of image exhibition. If
you would kindly bear with me a moment.

When getting a photographic pic ready for exhibition, one can
make decisions about borders in the process of enlargement (e.g.
I had a negative carrier that I filed specially to be a tiny bit
bigger than the neg so that a little light would shine through
and make a border photographically. It was in a certain period of
my photography). Later I preferred not to do this but to have the
flexibility to not have the border or have it by other means (I
would use Indian ink on the photo white space or the mounting
board).

The situation with a web page is not that much different in
respect to the placing of a basic border or padding, it does not
really matter when the decision is made to do this with many
types of images, leaving it to the css seems to me a perfectly
rational one in many cases. Perhaps not in all cases (here I am
thinking of borders that might strain the types available in css).

In other words, I do not think your action (see below in your
confession) was wrong at all. What matters is the aesthetic
decision and the easiest and most flexible way to implement it.

>
> If you are thinking about re-using the same images in different contexts on
> different pages, fine. But you should always check, for each use, whether
> the image really fits, esthetically and pragmatically. You may need to
> modify the image, e.g. resize it, pick up a different part from an original
> photograph, or change the colors of a drwawing to fit into a particular
> color scheme on a page. This is a job for an image processing program, not
> CSS code. The same applies to padding and border.
>
> (Confession: I have sometimes forgotten to add borders in an image
> processing program and then "fixed" this using border="1". But I'm not
> saying that this was right.)
>
> > CSS is for styling.
>
> Not for styling of images.
>
> > Borders and padding are style issues.
>
> So are colors and shapes in an image.

The point I am making is that while they are both aesthetic
matters, that does not mean that one is not best handled by image
software (clearly, colours and shapes are) or that borders and
padding can be handled by other means in many cases.

--
dorayme