...

View Full Version : Background-repeat y + margin-top?



Mayhem30
11-09-2010, 07:52 AM
I have a html table with 3 columns. My right column has a background image that repeats Y axis.

I want the background image to start showing at 30px down from the top (to leave room for my facebook 'like' button - otherwise it gets drowned out).

Is this possible? I've tried padding-top and margin-top and that didn't do a thing.



#right {
width:133px;
padding-top:15px;
background-color:#FFFFFF;
background-image: url(images/panel.jpg);
background-repeat: repeat-y;
text-align:center;
}

Chris Hick
11-09-2010, 08:10 AM
Use the background-position: xpos ypos using pixels or you can use percent.

Mayhem30
11-09-2010, 08:18 AM
I just tried :

background-position: 0px 30px;

All that did was move the top part down, but the bottom part starting showing up top instead (to fill in the missing space)

Chris Hick
11-09-2010, 08:21 AM
Mind showing the entire html and css, so that I can use my editor to look at it?


EDIT:

Or you can try setting the top margin to 30px then set the like button to the position to -30px.

Mayhem30
11-09-2010, 10:10 AM
http://www.giftauto.com/style2.css
http://www.giftauto.com/test.htm
^ Is what I'm doing

http://www.giftauto.com (original site)

This is a project that I'm helping the owner clean up - if you load the firebug addon in firefox, you will see the divs are crazy out of whack.

I've converted it in to 3 tables and cleaned up the code (the best I can) but having issues with the right column.

Any assistance would be greatly appreciated.

teedoff
11-09-2010, 02:52 PM
Most people are converting tables INTO divs, not the other way around. Tables are used for tabular display and dynamic content, not for layout.

Couldn't you have reworked the divs to suit your needs? It looks like a simply 3 column div with a header.

Chris Hick
11-09-2010, 05:35 PM
Tee said exactly what I was thinking as I read your post, Mayhem. Using a table for a layout is a BIG NO NO. As he said, tables are used for displaying tabular data and should only be used as a last resort for anything else (if that). I HIGHLY suggest you avoid what you are doing.

Mayhem30
11-09-2010, 07:33 PM
Ok, is it possible to have div act like tables - where I can put content in the left, middle, right columns without hvaing to worry about the content overflowing to another column?

I really want to get away from setting left margins to align the content in the proper columns.

teedoff
11-09-2010, 07:39 PM
Ok, is it possible to have div act like tables - where I can put content in the left, middle, right columns without hvaing to worry about the content overflowing to another column?

I really want to get away from setting left margins to align the content in the proper columns.

Divs can work like tables, but much better. Do some reading here (http://www.w3schools.com) and here (http://css-discuss.incutio.com/wiki/Why_I_think_divs_are_better_than_tables)to understand how divs with CSS float properties work.

Mayhem30
11-10-2010, 02:50 AM
Any off chance anyone here is looking for work?

I'd be willing to pay someone to create a simple 3 column "blank template" for me using divs. It would need it to be like the one on GiftAuto.com

Requirements :

I believe this sizes listed below will fit in a 1024x768 browser window - let me know otherwise.

Fixed width - centered (on all browsers)
Left Column : 248px
Middle Column : 540px (5px padding on left and right side only)
Right Column : 133px

I need the divs to behave as close to tables as possible. You must have done type of work before and know exactly what your doing.

PM me if your interested + list any example sites you have done (if applicable)

teedoff
11-10-2010, 03:03 AM
dude...lol 3 column layouts are easy. I can give you one, but you can adjust the widths as you need. Would that be ok??

Chris Hick
11-10-2010, 03:14 AM
Mayhem, what Tee is saying is quite true. I am too modest to take a fee for something so simple.

Mayhem30
11-10-2010, 03:33 AM
I just want to know it's done right - I rather not have to modify the widths myself because a problem will arise ...

teedoff
11-10-2010, 03:34 AM
I just want to know it's done right - I rather not have to modify the widths myself because a problem will arise ...

Then you have no desire to learn? You should really look into a local web designer to design your site to your specifications. And the layout is a basic layout that works pretty much like you wanted. Im just not going to GIVE you something and then have to tweak every little aspect when you could easily do that yourself. or at least try.

Chris Hick
11-10-2010, 03:40 AM
Mayhem, just message me.

Mayhem30
11-10-2010, 07:01 AM
Then you have no desire to learn? You should really look into a local web designer to design your site to your specifications. And the layout is a basic layout that works pretty much like you wanted. Im just not going to GIVE you something and then have to tweak every little aspect when you could easily do that yourself. or at least try.

It's not that I don't have the desire to learn. I just care that the template is done right. I do not want this to go in to production and have something mess up / not align properly.

If this was my site, sure I'd be willing to up with any quirks and tweak along the way .. but since it's not, I want to deliver the best product I can.

teedoff
11-10-2010, 03:09 PM
It's not that I don't have the desire to learn. I just care that the template is done right. I do not want this to go in to production and have something mess up / not align properly.

If this was my site, sure I'd be willing to up with any quirks and tweak along the way .. but since it's not, I want to deliver the best product I can.

So you're building a website for someone else, but want others to do the work for you? I dont understand.

At any rate, again like I have said twice, the layout I have works and it works in all browsers. It's a standard layout Dreamweaver has as a built in template. I meant you had to adjust the widths to what you wanted. ie 1200px wide or whatever.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum