?
Solved

HTML image center

Posted on 2009-05-15
7
Medium Priority
?
277 Views
Last Modified: 2012-06-21
how do i show an image always come center?
one html page has one image always come center.
and if i need to show text over image, how do i do it?
0
Comment
Question by:Hiroyuki Tamura
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 4
  • 3
7 Comments
 
LVL 19

Accepted Solution

by:
erikTsomik earned 500 total points
ID: 24397192
there number of may to do this.

<center><img src=""></center>

or
<div align="center"><img src=""></div>
0
 

Author Comment

by:Hiroyuki Tamura
ID: 24397201
thank you.
if i want to make any blank space between the corner of the window, what should i do?
0
 
LVL 19

Assisted Solution

by:erikTsomik
erikTsomik earned 500 total points
ID: 24397270
just add CSS. add id to the div
<style type="text/css">
#newLine{margin:10px;padding:10px;}

</style>

<div id="newLine" align="center"><img src=""></div>
0
Secure Your WordPress Site: 5 Essential Approaches

WordPress is the web's most popular CMS, but its dominance also makes it a target for attackers. Our eBook will show you how to:

Prevent costly exploits of core and plugin vulnerabilities
Repel automated attacks
Lock down your dashboard, secure your code, and protect your users

 

Author Comment

by:Hiroyuki Tamura
ID: 24397306
thank you.
if i have a link on the page, how do i make it?
should i do text over image and make link or use div to make a link over image?
i want to try text over image but i don't know how.
noname.jpg
0
 
LVL 19

Assisted Solution

by:erikTsomik
erikTsomik earned 500 total points
ID: 24397342
for example you have this
<div class="image">
  <img alt="" src="http://www.kavoir.com/img/text-over-image.jpg" />
  <div class="text">
    <p>test1.</p>
    <p>text2</p>
  </div>
</div>

Then you just add css to the <head> and it should work
.image {
      position:relative;
      float:left; /* optional */
}
.image .text {
      position:absolute;
      top:10px; /* in conjunction with left property, decides the text position */
      left:10px;
      width:300px; /* optional, though better have one */
}
0
 

Author Comment

by:Hiroyuki Tamura
ID: 24414839
thank you.
http://datapro.homeip.net/usone/
do you know how to align the image vertically center?
0
 

Author Closing Comment

by:Hiroyuki Tamura
ID: 31581988
thank you.
0

Featured Post

7 Extremely Useful Linux Commands for Beginners

Just getting started with Linux? Here's a quick start guide that has 7 commands that we believe will come in handy.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

When it comes to write a Context Sensitive Help (an online help that is obtained from a specific point in state of software to provide help with that state) ,  first we need to make the file that contains all topics, which are given exclusive IDs. …
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
In this tutorial viewers will learn how to embed videos in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <video> tag to insert a video. Define the src as the URL of your video; this is similar to …
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

765 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question