div and css big problem
-
- Posts: 348
- Joined: Thu Jan 12, 2006 8:24 pm
- Contact:
div and css big problem
i find it really dificult to work with div and css tags... can someone give a good explanation of how to align your web site images using div and css... i find it to be a piece of cake if i use tables...
use "class" for your divs and you could align how you want:
[HTML]<div class="css_class_name">your image</div>[/HTML]
and on css use:
P.S. this css is just an example from my website, but i hope it will give you a clue how to work with div's and css'es
[HTML]<div class="css_class_name">your image</div>[/HTML]
and on css use:
Code: Select all
.css_class_name
{
margin-left: -42px;
font-family: Arial;
font-size: 9px;
color : black;
text-transform:uppercase;
font-stretch: ultra-expanded;
}
-
- Posts: 348
- Joined: Thu Jan 12, 2006 8:24 pm
- Contact:
I'm trying to design a joomla template.... i cannot use a image tag in it.... i'm supposed to use those images in a css file itself.... hence getting confused in replicating a table structureLixas wrote:use "class" for your divs and you could align how you want:
[HTML]<div class="css_class_name">your image</div>[/HTML]
and on css use:P.S. this css is just an example from my website, but i hope it will give you a clue how to work with div's and css'esCode: Select all
.css_class_name { margin-left: -42px; font-family: Arial; font-size: 9px; color : black; text-transform:uppercase; font-stretch: ultra-expanded; }
How many pictures are there?
div { Background: url('http://someurl.com/someimg.jpg') }
If i remembered correctly, the correct way of using joomla is through its modules. You code the layout, and set the images in the GUI.
div { Background: url('http://someurl.com/someimg.jpg') }
If i remembered correctly, the correct way of using joomla is through its modules. You code the layout, and set the images in the GUI.
set the following style to display the image in the div without putting an image tag.
if you've any doubts on this let me know
Code: Select all
.css_class_name
{
margin-left: -42px;
font-family: Arial;
font-size: 9px;
color:#000;
text-transform:uppercase;
background:url("IMAGE_PATH") no-repeat;
height:HEIGHT_OF_IMAGE px;
width:WIDTH_OF_IMAGE px;
}
Remember that if you assign a padding to the container, you have to manually compensate for it by adding the same amount to the height and the width. However if you have a border, then it gets a lot more complicated due to the fact that IE and FF renders the border differently. In that case you'll need an IE conditional, and it would be better to just use an image in such cases.
DOES YOUR CAT OWN YOU
See how many yes answers apply to you. ? Do you select your friends based on how well your cats like them?? Does your desire to collect cats intensify during times of stress?? Do you buy more than 50 pounds of cat litter a month?? Do you think it?s cute when your cat swings on your **** or **** your butter?? Do you admit to non-cat owners how many cats you really have?? Do you sleep in the same position all night because it annoys your cats when you move?? Do you kiss your cat on the whiskers?? Do you feed your cat tidbits from the table with your fork?? Does your cat sleep on your head?? Do you like it?? Do you have more than four opened but rejected cans of cat food in the refrigerator?? Do you watch bad TV because the cat is sleeping on the remote?? Will you stand at the open door indefinitely in the freezing rain while your cat sniffs the door, deciding whether to go out or come in?? Would you rather spend a night at home with your cat than go out on a bad date?? Do you put off making the bed until the cat gets up?? Do you give your cat presents and a stocking at Christmas?
Div and CSS
Not a bad example.. lol reminds me of the old days..Lixas wrote:use "class" for your divs and you could align how you want:
[HTML]<div class="css_class_name">your image</div>[/HTML]
and on css use:P.S. this css is just an example from my website, but i hope it will give you a clue how to work with div's and css'esCode: Select all
.css_class_name { margin-left: -42px; font-family: Arial; font-size: 9px; color : black; text-transform:uppercase; font-stretch: ultra-expanded; }
.............................:: Spirit of Fire ::..................................