473,326 Members | 2,168 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,326 software developers and data experts.

Image positon with CSS

Hi,
Thanks for reading my post. I have a site and what I'm trying to do is put an image left, center, or right positioning on top of a header that's set as the background. I've looked around on the web, and tried a bunch of different things but I still can't seem to get it to work. This site kind of has it the way I want...(And I'm sure if I want it left right center whatever that it shouldn't be a problem to change if I want to change my mind on it's alignment.) The site's URL: (It's far from done...)(And I don't have a lot of experience; I'm using a template.)
http://shutterbug.freehostia.com/WebsiteTest/

Thanks in advance, and take it easy!
Nov 16 '06 #1
8 1420
AricC
1,892 Expert 1GB
This might help if not post your source code.
Nov 16 '06 #2
Thanks for your reply! With that code, and fooling around with some padding and floating, I've got it to work with left and right. Now I'd like to try to see if I can get it centered (without using padding, and the site's at moving 85% width). Here is the code I'm using now.

Expand|Select|Wrap|Line Numbers
  1. <style type="text/css">
  2. .headerfloatimg{
  3. padding:0px 7px 0px 0px;
  4. position:right;
  5. float:left;
  6. border:1px solid red;
  7. height:relative;
  8. width:172px;
  9. }
  10. .headerfloatimg img{
  11. padding:0px 7px 0px 0px;
  12. position:right;
  13. float:left;
  14. height:relative;
  15. width:relative;
  16. top:0px;
  17. right:0px;
  18.  
  19. }
  20. </style>
  21. -------------------------------------
  22. <div class="headerfloatimg"><img src="images/logo.png"></img></div>
  23.  
Thanks, I much appreciate it!
Nov 16 '06 #3
AricC
1,892 Expert 1GB
Can you post a link so we can see what you are trying to do?
Nov 16 '06 #4
Sure.
http://shutterbug.freehostia.com/WebsiteTest/
Ignore the padding and the border for now...Also, I'll be using a different image than that one, but that shouldn't change much.
I have left and right covered, I just would like to try center (I don't know which one I wan to use yet because I'm going to change the banner). And the image is of course the one that says Nautica Liquid

Thanks!
Nov 16 '06 #5
AricC
1,892 Expert 1GB
Try:

Expand|Select|Wrap|Line Numbers
  1. margin-right: auto;
  2. margin-left: auto;
Nov 16 '06 #6
drhowarddrfine
7,435 Expert 4TB
Some of your attributes don't exit. See if this is what you want:

.headerfloatimg{
padding:0px 7px 0px 0px;
margin:0 auto;
border:1px solid red;
width:172px;
}
.headerfloatimg img{
padding:0px 7px 0px 0px;
top:0px;
right:0px;
}

There is no 'position:right' or 'height: relative' or 'width:relative'
Also, you can remove the red border because it was only placed there to highlight it.
Nov 16 '06 #7
AricC
1,892 Expert 1GB
Not sure that it matters I think dr fixed your problem but there is a position: relative doubt you need it in this instance.
Nov 17 '06 #8
Thanks for all of your help. I'm just keeping that border for now; I'll take it off once the header is all set. The center thing works, but it messes up a couple of images and pushes it down... I wish there could be a float:center lol. Other than that I'm all set.
http://shutterbug.freehostia.com/WebsiteTest/

Thanks in advance!
Nov 17 '06 #9

Sign in to post your reply or Sign up for a free account.

Similar topics

9
by: Pierre Tremblay | last post by:
Hi! I am trying to display an image in my html document. The document contains the following line: <td class="Input"><img...
3
by: dave | last post by:
Hello there, I am at my wit's end ! I have used the following script succesfully to upload an image to my web space. But what I really want to be able to do is to update an existing record in a...
0
by: Kenan | last post by:
hi, i want to get the part of a text where i click (where the mouse positon is) as it's done in glossary program "babylon". this text can be any part of a name of an icon,a window...
2
by: Tjerk | last post by:
Hello all, I have the script below to change an image depending on the date upto january it worked fine but then it just stopped working does anybody have an idea how I can make it work again or...
15
by: Anand Ganesh | last post by:
HI All, I have an Image. I want to clip a portion of it and copy to another image. How to do this? I know the bounding rectangle to clip. Any suggestions please. Thanks for your time and...
4
by: Carmen de Lara | last post by:
hi all, i have a master detail form. In the datagrid control i have the following code Private Sub dtgCobD_CurrentCellChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles...
7
by: lgbjr | last post by:
Hello All, I¡¯m using a context menu associated with some pictureboxes to provide copy/paste functionality. Copying the image to the clipboard was easy. But pasting an image from the clipboard...
15
by: David Lozzi | last post by:
Howdy, I have a function that uploads an image and that works great. I love ..Nets built in upload, so much easier than 3rd party uploaders! Now I am making a public function that will take the...
0
Debadatta Mishra
by: Debadatta Mishra | last post by:
Introduction In this article I will provide you an approach to manipulate an image file. This article gives you an insight into some tricks in java so that you can conceal sensitive information...
0
by: ryjfgjl | last post by:
ExcelToDatabase: batch import excel into database automatically...
0
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
1
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: Vimpel783 | last post by:
Hello! Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
0
by: jfyes | last post by:
As a hardware engineer, after seeing that CEIWEI recently released a new tool for Modbus RTU Over TCP/UDP filtering and monitoring, I actively went to its official website to take a look. It turned...
1
by: CloudSolutions | last post by:
Introduction: For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...
1
by: Shællîpôpï 09 | last post by:
If u are using a keypad phone, how do u turn on JavaScript, to access features like WhatsApp, Facebook, Instagram....
0
by: af34tf | last post by:
Hi Guys, I have a domain whose name is BytesLimited.com, and I want to sell it. Does anyone know about platforms that allow me to list my domain in auction for free. Thank you
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 3 Apr 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome former...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.