By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
443,309 Members | 1,452 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 443,309 IT Pros & Developers. It's quick & easy.

How to float text around image

P: n/a
Hello,
What I would like is to float some text around the image where the text
starts align on the left or right of the image aligned to the top of the
image and then wrap around the image. I have tried using the .imgright
{float: right;} or .imgleft {float: left;} in my draft css. I have looked at
other suggestion on the net by using a span class but I am having problems
adding it to my <div class="contpara" now such luck.
Here is my draft css:

BODY {
BACKGROUND-IMAGE: url(graybg.gif); BACKGROUND-REPEAT: repeat-y;
BACKGROUND-COLOR: #ffffff
}
LI {
FONT-SIZE: 12px; COLOR: #0000cd; FONT-FAMILY: Georgia, "Times New Roman",
Times, serif; LIST-STYLE-TYPE: square
}
UL {
COLOR: #0000cd; LIST-STYLE-TYPE: square
}
..contpara {
FONT-SIZE: 12px; LINE-HEIGHT: 120%; FONT-FAMILY: Georgia, "Times New
Roman", Times, serif
}
H1 {
FONT-WEIGHT: bold; FONT-SIZE: 14px; COLOR: #0000cd; FONT-FAMILY: Verdana,
Arial, Helvetica, sans-serif; LETTER-SPACING: 2px
}
A:link {
COLOR: #669999; TEXT-DECORATION: underline
}
A:visited {
COLOR: #999999; TEXT-DECORATION: underline
}
A:hover {
COLOR: #000000; TEXT-DECORATION: underline
}
A:active {
COLOR: #000000; TEXT-DECORATION: underline
}

..imgright {
float: right;
padding: 10px;
}

And then I added this to my draft.html
<div class="contpara">
<H1>test</H1>
<P><img src="tttest" width="100" height="100" class="imgright"
alt="test">Once test blah blah blah.</P>

Thanks for your help in the past
Jul 21 '05 #1
Share this Question
Share on Google+
2 Replies


P: n/a
in comp.infosystems.www.authoring.stylesheets, mike wrote:
Hello,
What I would like is to float some text around the image where the text
starts align on the left or right of the image aligned to the top of the
image and then wrap around the image. I have tried using the .imgright
{float: right;} or .imgleft {float: left;} in my draft css. I have looked at
other suggestion on the net by using a span class but I am having problems
adding it to my <div class="contpara" now such luck.
¨Your description does not make sence
Here is my draft css:

Snip of lots of irrelevant code I would need to change to get it work.
Thanks for your help in the past


Rather give URL. Or at least some code that makes some sence with some
description that makes sence.

Questions:
1. URL(s)
2. What is what you want to happen?
(3. If you get something work somehow, what change makes it not work?`)

--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Jul 21 '05 #2

P: n/a
Possibly the page:
http://www.nsm88.com/articles/mossad...%20jailed.html
and its associated .css page will solve the problem for you.

I found that I had to add an extra <p> tag to get the text to line up
properly with the top of the image on

http://www.nsm88.com/articles/amsterdam_mosque.html

Both pages use the same very basic css page.
"Lauri Raittila" <la***@raittila.cjb.net> wrote in message
news:MP************************@news.individual.ne t...
in comp.infosystems.www.authoring.stylesheets, mike wrote:
Hello,
What I would like is to float some text around the image where the text starts align on the left or right of the image aligned to the top of the
image and then wrap around the image. I have tried using the .imgright
{float: right;} or .imgleft {float: left;} in my draft css. I have looked at other suggestion on the net by using a span class but I am having problems adding it to my <div class="contpara" now such luck.


¨Your description does not make sence
Here is my draft css:


Snip of lots of irrelevant code I would need to change to get it work.
Thanks for your help in the past


Rather give URL. Or at least some code that makes some sence with some
description that makes sence.

Questions:
1. URL(s)
2. What is what you want to happen?
(3. If you get something work somehow, what change makes it not work?`)

--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>

Jul 21 '05 #3

This discussion thread is closed

Replies have been disabled for this discussion.