Rounded table corner difficulties...please help
I am trying to achieve a rounded table corner affect at http://arielladog.tripod.com/SCAHPERD/homepage.html I have the two images that I want and they are there corectly, atleast in my browser; I also have another image of a blue line which I use around the right side of the table (top and bottom of the right side);anyway, I got a pixel image with a transparent color and I resized it so that the two ends were even. It is a pain, and I'm not sure if it works at all resolutions, on all browsers (I know it doesn't work on all browsers because I had to make IE and NS use different heigths for the image). Isn't there an easier way...if so please share because I am in dire (spelling?) of help.
Moderate at JavaScriptCity Forums
tazman posted this at 04:06 — 13th March 2000.
They have: 99 posts
Joined: May 1999
Just not clear what you mean...do you have an example or code for the problem you are encountering...
If what you are encountering is difficulty slicing an image, then I would recommend a graphics pack such as fireworks...
Tazman
Arielladog posted this at 04:32 — 13th March 2000.
They have: 122 posts
Joined: Jun 1999
Alright, reading back...I see how it wasn't real clear. I want a rounded table edge at my page listed above. I have achieved this. As you know rounded edges can't be done with code, so I had to create an image and stick it in the corners. At the same time, I had to stick an image of a blue line in the top and bottom of the other table cell on the right. Now, I tried using code to make the line and the table corner images to stay on top and bottom..I can make them stay to left and right. So, to make them stay on top and bottom, I add spaces in between the two graphics. For example, I added space between the first table corner and the second table corner, and the line on top and the line on bottom. As I do so, I can get one to stay on absolute top and absolute bottom of their cell. Then, I would try to do the other one, but as I did some spaces, the table would get bigger and the table corners on the left wouldn't be at the top and the bottom anymore. So, to get around this, I decided to make a transparent image. Then, I put that in each of the table cells, and adjusted the heigths so that the table corners on the left and the lines on the left were even. Since the pixels are different in IE and NN, I created a script to recognize the, and set the pixels heigth to be different in each of the browsers. Is there an easier way than this?
Moderate at JavaScriptCity Forums
Suzanne posted this at 07:32 — 13th March 2000.
She has: 5,507 posts
Joined: Feb 2000
I have a page of tables tips (see my sig) that may help. Looking at the site in question, I would set up the table to the top cells were valign=top, the bottom valign=bottom and the right side valign=right.
Of course having your images the right size helps, but I didn't check to see if that was the case.
I always draw out my tables (or turn on the borders) to see where the problem lies and then rebuild them. You can certainly make tables work cross-browser, but making them an exact pixel size isn't likely without the browser detection. Most of us just live with the difference.
If you check out the source code to the tables page (in my sig) and the images, you will see that I have it repeating in the background. I should note that the source code I use is for full-bordered, full page table outlines, i.e. it goes right to the edge. For full-bordered tables that are smaller, you can cut out a lot of the code.
hth,
Suzanne
------------------
Zero Cattle
Suzanne
Tables DeMystified
Arielladog posted this at 01:17 — 14th March 2000.
They have: 122 posts
Joined: Jun 1999
My real probelem is that I have an image of a blue line that I use as a border for the topa nd bottom part of the right row. It isn't that same size as the corners though..suggestions?
Moderate at JavaScriptCity Forums
Roo posted this at 04:07 — 15th March 2000.
She has: 840 posts
Joined: Apr 1999
The left side isn't showing at all in NN...you need to put a transparant gif in there in order to make it display.
Roo
Arielladog posted this at 04:23 — 15th March 2000.
They have: 122 posts
Joined: Jun 1999
Hey, check it out now...I got it..HORAY.
Arielladog posted this at 04:25 — 15th March 2000.
They have: 122 posts
Joined: Jun 1999
Hey, check it out now...I got it..HORAY. Take a look and tell me if it looks good to you?
Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.