467,213 Members | 1,087 Online
Bytes | Developer Community
Ask Question

Home New Posts Topics Members FAQ

Post your question to a community of 467,213 developers. It's quick & easy.

img and spacing

I am trying to create a tab row, but the image tags that I am using are spaced too far apart. The tabs are between a div tag, and have been assigned a class. In the CSS file I have removed padding, margins, display is inline. Other than setting the position on the img itself, what else can I do remove the space between the tabs?

Thanks,
Leo
Apr 5 '07 #1
  • viewed: 3244
Share:
10 Replies
I am trying to create a tab row, but the image tags that I am using are spaced too far apart. The tabs are between a div tag, and have been assigned a class. In the CSS file I have removed padding, margins, display is inline. Other than setting the position on the img itself, what else can I do remove the space between the tabs?

Thanks,
Leo
maybe start your css with

Expand|Select|Wrap|Line Numbers
  1. *{
  2. padding:0;
  3. margin:0;
  4. border:0;
  5. }
that sometimes work then add a class for your picture paddingas required

cheer
philleep
Apr 5 '07 #2
nomad
Expert 512MB
I used columns for my tabs. I made all the tabs the same sized.
Then I made a table at 500 pixels with the number of tabs I had.
So if I had 6 tabs I divided 6 into 500 then I div center.



nomad
Apr 5 '07 #3
These suggestions work when I am not using an image tag. The problem is that the image tag is leaving about 3 to 4 pixels space between the images. I have done very little with images, and I would like to know if removing this space is possible. The space is not there when I am using anchors, buttons, div tags, or even tables. It appears something related to images only. Like there is a built in padding on the images. Is there something specific with PNG images that need to be looked at?

Thanks,
Leo
Apr 5 '07 #4
KevinADC
Expert 2GB
No there is not, how are you writing the hml code? If you don't want a space don't leave one in the code:

Expand|Select|Wrap|Line Numbers
  1. <img src="frog.jpg><img src="cat.jpg><img src="cow.jg">
Apr 5 '07 #5
Thanks that was the problem. I had all the img tags on separate lines for easy reading and editing.

Leo
Apr 5 '07 #6
KevinADC
Expert 2GB
you can do it like this:

Expand|Select|Wrap|Line Numbers
  1. <img 
  2. src= frog,jpg><img
  3. src= cat.jpg><img
  4. src= cow.jpg>
which might or might not help you with keeping the source code editable/readable.
Apr 5 '07 #7
drhowarddrfine
Expert 4TB
This is a bug in IE only.
Apr 5 '07 #8
This is a bug in IE maybe, but I find the same bug handy when I am using title attributes. This bug lets me put carriage returns in the title attibute. This helps when I am using the title attribute like a tooltip to give a formatted bubble information that has multiple lines of information (i.e. an anchor tag in a table that displays an abrreviated name that when you mouse over, not only do you get the full name but a second line with the contact information). Bug in one place, feature in another. It is a matter of perspective and frustration when you forget the rules of the game.
Apr 9 '07 #9
drhowarddrfine
Expert 4TB
The only problem is you shouldn't rely on bugs to continue to exist in the future. Especially when there are reliable ways to make this work without bugs.
Apr 9 '07 #10
I agree completly. Which is why my pages are designed for cross browser support and I have ways to make them acceptable without relying on bugs. But I also have it setup in such a way that as long as the bug exists the pages can leverage them for better display. When the bug vanishes then we go back to what every other browser displays. Simple, but it makes my users happy, and really doesn't take any extra time to code.
Apr 9 '07 #11

Post your reply

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

Similar topics

12 posts views Thread by Rick DeBay | last post: by
7 posts views Thread by Danny@Kendal | last post: by
5 posts views Thread by Andrew Poulos | last post: by
4 posts views Thread by fleemo17@comcast.net | last post: by
12 posts views Thread by Sebastien B. | last post: by
3 posts views Thread by DigMar | last post: by
10 posts views Thread by phil-news-nospam@ipal.net | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.