FRIHOST • FORUMS • FAQ • TOS • BLOGS • DIRECTORY
You are invited to Log in or Register a Frihost Account!

[Finish] Problem for align a picture

   Frihost Forum Index -> Scripting -> Html, CSS and Javascript
 


DataMAX
Hello

My problem is i don't know had a good position to my picture. Look:



And i want:



I have tray with "Position: Absolute, Fixed, Relative and Static" but anything is how i want Crying or Very sad Crying or Very sad Crying or Very sad

Have you solutions ???

Last edited by DataMAX on Sat Aug 26, 2006 5:51 pm; edited 1 time in total
mathiaus
I'd suggest a float here and just fiddle round a bit then with margins and padding Smile
Code:
<img src="" alt="" style="float: right;" />
DataMAX
There isn't a CSS solution ? Shocked
DataMAX
I had try, but it's same

The best result is "absolute"
SlowWalkere
Ideally, you would use that "float: right" in your css definition for that img tag and it should work. However, float does some weird stuff sometimes.

If you don't get it to work that way, try this...
Code:
/* CSS for img */
img {
  position:relative;
  right:0px;
  margin:10px;
}


Make sure the img tag is the last element in the div. I just tried it out on a test site and it worked fine. If you fiddle with the margin value you can get it to the exact space that you want.

Good luck,
- Walkere
DataMAX
It doesn't work Crying or Very sad Crying or Very sad Crying or Very sad
b4r4t
place text in one div and this picture in another , give them display inline and for one set margin right or left to set it as You want Smile
It should work Smile
DataMAX
Hé hé, i found before looking your tip b4r4t, and it's work

This is my HTML code
Code:
<a class="lienff" href="http://www.mozilla-europe.org/fr/" alt="Obtenez Firefox" title="Obtenez Firefox"></a>


My CSS code
Code:
.lienff
{
   background-image: url("images/getffblanc.gif");
   background-repeat: no-repeat;
   display: inline;
   position: absolute;
   margin-left: 260px;
   width: 80px;
   height: 15px;
}
.lienff:hover
{
   background-image: url("images/getffbleu.gif");
   background-repeat: no-repeat:
}


Mega thanks to all Wink Wink
DataMAX
An alternative for killed pre-load time

Code:
.lienff
{
   background-image: url("images/getff.gif");
   background-repeat: no-repeat;
   display: inline;
   position: absolute;
   margin-left: 260px;
   width: 80px;
   height: 15px;
}
.lienff:hover
{
   background-image: url("images/getff.gif");
   background-repeat: no-repeat;
   background-position: 0px -15px;
}


My picture



Wink Wink
Reply to topic    Frihost Forum Index -> Scripting -> Html, CSS and Javascript

FRIHOST HOME | FAQ | TOS | ABOUT US | CONTACT US | SITE MAP
© 2005-2007 Frihost, forums powered by phpBB.