?
Solved

sliced image shows separation in html

Posted on 2003-03-05
11
Medium Priority
?
160 Views
Last Modified: 2010-04-03
I have an image that is sliced up.  But after editing the table in Dreamweaver it shows up with separations between the slices.

Originally it appeared that some of the cells were too big for the table.  But now that they are removed, I cannot get the separations to go away.

how can i fix this?
0
Comment
Question by:AWP
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
  • 2
  • 2
  • +4
11 Comments
 
LVL 4

Accepted Solution

by:
dearsina earned 600 total points
ID: 8079006
Make sure all the margins are set to 0, cellspacing to 0, border size to 0, make sure that no   occur unless you want them, just go over your code again and again, it's usually little things one forgets, a pain in the nut, but such is coding.

sina
london

0
 

Expert Comment

by:arumalla
ID: 8085318
Hi AWP

Why Worry,

once you slice it up you have a chance to create a html page from the photoshop/Imageready. you just click that button and let the photoshop/Imageready create the page.

just cut the code once it created and paste it where ever you want.

Isn't it a cool job....lol...

enjoy...

Chandra Arumalla.
0
 
LVL 4

Expert Comment

by:dearsina
ID: 8085345
arumalla, i think the issue here is that he *has* made an HTML file out of it, but that after editing this file, the slices don't stick together anymore.

sina
london

0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
LVL 2

Expert Comment

by:Kovis
ID: 8086255
Usually caused by the fact that if you don't give any hspace or vspace values to image, the default values for them are not zero. So try adding hspace="0" and vspace="0" to your images. If the tables cellspacing and cellpadding are also set to zero, then it should work.
0
 

Expert Comment

by:JJR
ID: 8086845
Where's the problem? I edit the code directly in HomeSite and it's OK. But I have to not to change size of slices and/or table cells.
0
 

Expert Comment

by:JJR
ID: 8086855
... sorry:
... But I have to change neither size of slices nor table cells.
0
 
LVL 1

Expert Comment

by:nasdaqphil
ID: 8088141
This is possibly an insane idea, but can you add a blank 1x1 pixel image to shim the image...add it to the top cell of your slices and see if that cures it.  Sometimes these things are just a pain and dont make sense and you need to give it a quick fix and shim it with a blank white pixel or whatever to match your background...that could knock everything into line - possibly.  I still agree with other though that there's gotta be something inside your code...perhaps you have a table inside a table by accident and your adjusting the code for the inside table but the outside table has a 1 cellpadding instead of zero?  Becasue the 2 table are so close together it is sometimes hard to see that you have a table inside a table or that you have a cell padding or cell spacing somewhere in there of 1 instead of 0.  Those type of things drive me nuts too...happens all the time.
0
 
LVL 19

Expert Comment

by:webwoman
ID: 8088670
Actually, it's probably those 1x shims that ARE the problem.

You're going to need to check the rowspan/colspan VERY carefully, and probably delete most, if not ALL the 1x shims. What usually causes this is the rowspan/colspan or shim width/heights being out of sync with the rest of the table. Those shims are set for a particular size table, same with the row/colspans. Take out cells/rows, and they're ALL screwed up. That causes the gaps.

I usually start by taking out the entire first row of the table (it's shims), and the last cell of each row, unless it's a rowspan. Also, turn on the BORDER so you can see how the table is constructed.

Once you do that, it will be pretty obvious where the problems are, and you can change the cell attributes in DW to make it right.
0
 

Author Comment

by:AWP
ID: 8089644
I'm going to take dearsina's advice to set the margins=0, cellspacing=0, border size=0, take out &nbsp.

Yes the problem is i've already got an html page that the slices are in, but after adding additional graphics not associated with the sliced image, now the cells are separating.

i'll let you know.
0
 
LVL 19

Expert Comment

by:webwoman
ID: 8090533
>>Yes the problem is i've already got an html page that the slices are in, but after adding additional graphics not associated with the sliced image, now the cells are separating.

Changing the margins/etc. ain't gonna do it. You're going to have to rewrite the ENTIRE table, and probably reslice some of the graphics to get background pieces.

Been there, done that... many many times.
0
 

Author Comment

by:AWP
ID: 8091677
In the code.
It seems there was an unneeded, empty cell at the top of the table.  I'm not sure how it got in there and it was hard to see.  When I deleted it, everything went back into place very nicely.

Thanks for all the comments.
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

HOW TO CREATE A WEB 2.0 IMAGE WITH A REFLECTION I would like to start by saying I know Web 2.0 isn't a style. It is actually the practice of information sharing or  collaboration on the Web. It is also associated with the technology that is used …
In this article, I'll explain how to change the color of a selection in Photoshop. I'm sure there are a couple different ways to do this in photoshop, but this is my preferred method in Photoshop. I am using Photoshop CS6 and I will be adjusting the…
In this Micro Tutorial viewers will learn how to create a CSS image sprite (In a later tutorial, viewers will learn how to use CSS and HTML to create a navigation menu using this sprite) Open a new Photoshop document with a width of (Icon width)x(N…
In this tutorial viewers will learn how to correct colors in Photoshop using the Hue and Saturation adjustment Open a photo for editing in Photoshop: Begin by creating a new adjustment layer by going to Layer > New Adjustment Layer > Hue and Saturat…
Suggested Courses
Course of the Month8 days, 21 hours left to enroll

764 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question