image and text display not working
I have an html file like this.I am getting the output like this in picture1.But i need an output like this in picture2.mainly text should be parallel to the image
<html 开发者_如何学Pythonxmlns=\"http://www.w3.org/1999/xhtml\" lang=\"en-US\" xml:lang=\"en-US\">
<head>
<title>MigraineMate Paint Graph</title>
<meta http-equiv=\"Content-Type\" content=\"text/html; charset=iso-8859-1\" />
<link href=\"default.css\" rel=\"stylesheet\" type=\"text/css\"/>
</head>
<body>
<img src=\"Justin.png\" alt=\"justin Biber\"/>
<div id=\"notification\">
<h1>Please Wait Graph may take a moment to load</h1>
</div>
</body>
</html>
and css file is
#notification
{
width: 860px;
height: 730px;
margin: auto;
background-color: transparent;
}
#notification h1
{
padding-top: 15px;
padding-left:0px;
font-family: Georgia, "Times New Roman", Times, serif;
font-size:20px;
}
You may start with left-floating the beaver:
<img src="..." alt="..." style="float:left; text-align:left;" />
Here are some quick notes.
You need to add {float: left;}
to the image to allow the text to wrap around it. Remeber to also clear the float afterwards using something like <div style="clear: both;"></div>
精彩评论