By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
437,648 Members | 1,190 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 437,648 IT Pros & Developers. It's quick & easy.

img and spacing

P: 45
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
Share this Question
Share on Google+
10 Replies


P: 74
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 100+
P: 664
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

P: 45
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 2.5K+
P: 4,059
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

P: 45
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 2.5K+
P: 4,059
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 5K+
P: 7,435
This is a bug in IE only.
Apr 5 '07 #8

P: 45
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 5K+
P: 7,435
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

P: 45
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.