Go Back   CodingForums.com > :: Client side development > HTML & CSS

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 10-02-2004, 10:36 AM   PM User | #1
lalo
New Coder

 
Join Date: Sep 2004
Location: Guadalajara, Mexico
Posts: 52
Thanks: 0
Thanked 0 Times in 0 Posts
lalo is an unknown quantity at this point
Converting a table with images into css

Hi again

I have this box that uses images, I had previously made it with tables (didn't know about the css "movement" then ), and I have tried to convert it into css only but I can't manage to get it right . So I hope someone could help me out. Heres the (Edit: "Link Removed per user request") with tables, this is the style (Edit: "Link Removed per user request") file and here are the (Edit: "Link Removed per user request")

I didn't set a specific width or height for the main content area, since this to organize diferent sized content text.

... Or you could show me a link were this is explained...notice that I have gone to most of the pinned sites at this forum but I haven't seen anything specific to this, most of these sites use a whole image as the boxe's background instead.

Last edited by sage45; 10-04-2005 at 04:41 PM..
lalo is offline   Reply With Quote
Old 10-02-2004, 11:22 AM   PM User | #2
ReadMe.txt
Regular Coder

 
Join Date: Jun 2002
Location: Sheffield, UK
Posts: 552
Thanks: 0
Thanked 0 Times in 0 Posts
ReadMe.txt is an unknown quantity at this point
so what do you have so far on turning it into CSS? it seems to me like you are jsut asking us to do it for you. Here's how it should be marked up:
Code:
<div class="box"> <!--Shouldnt really be box but i dont know the context of your usage, perhaps "newspost" or "comment" would be better-->

<h2>This is the box title</h2>

<div class="content">
<p>Stuff</p>
<p>More Stuff</p>
<p class="last">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat</p>
</div>

</div>
That should provide you with enough hooks to use the http://alistapart.com/articles/customcorners/ method.

Although having just skim read that artcile i remembered how much i dont like the idea of that many needless divs, you might need another one in that markup =/
__________________
"To be successful in IT you don't need to know everything - just where to find it in under 30 seconds"

(Me Me Me Me Me Me Me Me Me)
ReadMe.txt is offline   Reply With Quote
Old 10-02-2004, 11:42 AM   PM User | #3
lalo
New Coder

 
Join Date: Sep 2004
Location: Guadalajara, Mexico
Posts: 52
Thanks: 0
Thanked 0 Times in 0 Posts
lalo is an unknown quantity at this point
thanks, I think thats the perfect tut for this

I'll give it a go...and we'll see.
lalo is offline   Reply With Quote
Old 10-02-2004, 01:54 PM   PM User | #4
lalo
New Coder

 
Join Date: Sep 2004
Location: Guadalajara, Mexico
Posts: 52
Thanks: 0
Thanked 0 Times in 0 Posts
lalo is an unknown quantity at this point
Well... I followed that tutorial, and it quite looks how I want it to be, but the only thing I can't manage to do is to make the header text look like the one with tables (the vertical position of it), and if I decrease the padding from it, then the bottomright image overlaps the topright image, is there anyone who knows what to do about this?

Here's the (Edit: "Link Removed per user request") without tables, this is the new style (Edit: "Link Removed per user request") and here are the (Edit: "Link Removed per user request")

I kept the one with tables so that people get an idea of what I'm talkign about. (the ones at my first post)

Hope someone knows or at least give me a hint!

Last edited by sage45; 10-04-2005 at 04:41 PM..
lalo is offline   Reply With Quote
Old 10-03-2004, 02:46 PM   PM User | #5
lalo
New Coder

 
Join Date: Sep 2004
Location: Guadalajara, Mexico
Posts: 52
Thanks: 0
Thanked 0 Times in 0 Posts
lalo is an unknown quantity at this point
I finally did it, if anyone is interested here's the (Edit: "Link Removed per user request") to the final box , and I had to follow other tutorial so that it worked with the type of box that I wanted, heres the tutorial (Edit: "Link Removed per user request"), I used the second example and changed it a bit to suit my needs.

Last edited by sage45; 10-04-2005 at 04:40 PM..
lalo is offline   Reply With Quote
Old 10-04-2004, 08:49 AM   PM User | #6
ronaldb66
Senior Coder

 
Join Date: Jun 2002
Location: The Netherlands, Baarn, Ut.
Posts: 4,253
Thanks: 0
Thanked 0 Times in 0 Posts
ronaldb66 is an unknown quantity at this point
Thanks for the follow-up!

Lalo,

Great that you finished your thread with the final solution; now when others are searching to solve something like this, they'll find how you cracked it: very good!
__________________
Regards,
Ronald.
ronaldvanderwijden.com
ronaldb66 is offline   Reply With Quote
Old 10-05-2004, 05:07 AM   PM User | #7
lalo
New Coder

 
Join Date: Sep 2004
Location: Guadalajara, Mexico
Posts: 52
Thanks: 0
Thanked 0 Times in 0 Posts
lalo is an unknown quantity at this point
thanks
lalo is offline   Reply With Quote
Reply

Bookmarks

Jump To Top of Thread


Thread Tools
Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT +1. The time now is 01:02 AM.


Advertisement
Log in to turn off these ads.