Website help, please

Bed & Breakfast / Short Term Rental Host Forum

Help Support Bed & Breakfast / Short Term Rental Host Forum:

This site may earn a commission from merchant affiliate links, including eBay, Amazon, and others.

Morticia

Well-known member
Joined
May 22, 2008
Messages
17,771
Reaction score
685
I am trying to lay 2 tables side by side. They are off by a pixel or two, with the second table being slightly, but annoyingly, lower than the first. They are the same size. Helpful hints on how to get them to line up exactly are greatly appreciated.
If I lay tables on top they are fine, it's the side to side that's not working. I have set all the cellpadding, spacing to '0'.
 
Two ways to do it:
1. put the two tables inside a big table that "wraps" the other two, so you have:
<table>
<tr><td><table id=1><tr>...</tr></table></td><td><table id=2><tr>...</tr></table></td></tr>
</table>
- or -
2. put the two tables inside a <div>, like:
<div><table> ... </table><table>...</table></div>
The first is more precise but will load more slowly
 
Too many ways this can go wrong to tell you exactly why it is happening without seeing the example. It can be as simple as having a space between closing of one table and the begining of the other (... </table> <table> ...) or the widths you are applying to the tables or the method you are using to float one table left and one right.
 
If possible I'd suggest switching to using Divs and CSS instead of tables (tables are no longer standard web layout methods, unless using tabular data). As swirt says, it would be really helpful to see the full code though.
Cheers.
 
Too many ways this can go wrong to tell you exactly why it is happening without seeing the example. It can be as simple as having a space between closing of one table and the begining of the other (... </table> <table> ...) or the widths you are applying to the tables or the method you are using to float one table left and one right..
I think the 'float' is what's missing. I'll add that and see what happens. Then again, I think Catlady solved another problems that may not require the tables being left and right. Hopefully will be back later with a complete page.
 
If possible I'd suggest switching to using Divs and CSS instead of tables (tables are no longer standard web layout methods, unless using tabular data). As swirt says, it would be really helpful to see the full code though.
Cheers..
CSS defeats me. But I know it's the right thing to do.
 
Two ways to do it:
1. put the two tables inside a big table that "wraps" the other two, so you have:
<table>
<tr><td><table id=1><tr>...</tr></table></td><td><table id=2><tr>...</tr></table></td></tr>
</table>
- or -
2. put the two tables inside a <div>, like:
<div><table> ... </table><table>...</table></div>
The first is more precise but will load more slowly.
Option 1 is what I thought I had. It's probably punctuation, it always is.
 
A question...with Catlady's help, I am trying to use a template for CSS. I am trying to center an element. I have set a width for an element I will call 'content'. Altho I have been able to get it to stop hugging the left margin, it will not center. I cannot make it hug the right margin, so something tells me I have not really figured out how to do this.
So, here's what I have.
#content{
/*margin-left:auto;
margin-right:auto;*/
width: 817px;
text-align: center;
background-color: #ffffff;
background-position:center top;
}
I tried using the margins set to auto, to no avail, so they are commented out.
What I get is that content element slightly left of center. I've been using the W3 CSS tutorial to find answers, but I'm not succeeding.
Using this page for info
This isn't really what I started out to do this weekend, but what the heck. Anyone who's been around knows I go at this every year at least once!
My initial grief was trying to load a premade CSS template into FrontPage. It got all squiffy right off and I've been trying to work back from there.
 
A question...with Catlady's help, I am trying to use a template for CSS. I am trying to center an element. I have set a width for an element I will call 'content'. Altho I have been able to get it to stop hugging the left margin, it will not center. I cannot make it hug the right margin, so something tells me I have not really figured out how to do this.
So, here's what I have.
#content{
/*margin-left:auto;
margin-right:auto;*/
width: 817px;
text-align: center;
background-color: #ffffff;
background-position:center top;
}
I tried using the margins set to auto, to no avail, so they are commented out.
What I get is that content element slightly left of center. I've been using the W3 CSS tutorial to find answers, but I'm not succeeding.
Using this page for info
This isn't really what I started out to do this weekend, but what the heck. Anyone who's been around knows I go at this every year at least once!
My initial grief was trying to load a premade CSS template into FrontPage. It got all squiffy right off and I've been trying to work back from there..
Is your #content div inside of another div which is throwing it off center?
Can you throw up a demo page someplace and link to it so we can see what you are trying to do, would like to help but there just isn't enough to go on at this point.
Cheers
 
A question...with Catlady's help, I am trying to use a template for CSS. I am trying to center an element. I have set a width for an element I will call 'content'. Altho I have been able to get it to stop hugging the left margin, it will not center. I cannot make it hug the right margin, so something tells me I have not really figured out how to do this.
So, here's what I have.
#content{
/*margin-left:auto;
margin-right:auto;*/
width: 817px;
text-align: center;
background-color: #ffffff;
background-position:center top;
}
I tried using the margins set to auto, to no avail, so they are commented out.
What I get is that content element slightly left of center. I've been using the W3 CSS tutorial to find answers, but I'm not succeeding.
Using this page for info
This isn't really what I started out to do this weekend, but what the heck. Anyone who's been around knows I go at this every year at least once!
My initial grief was trying to load a premade CSS template into FrontPage. It got all squiffy right off and I've been trying to work back from there..
Is your #content div inside of another div which is throwing it off center?
Can you throw up a demo page someplace and link to it so we can see what you are trying to do, would like to help but there just isn't enough to go on at this point.
Cheers
.
Thanks, but I'm doing this all offline right now.
 
if you need help let me know. We can take care of this for you..
paulavery said:
if you need help let me know. We can take care of this for you.
Believe me, I looked with longing at your offer of a few weeks ago! This has now become a challenge for me. If I can't make it work, I'll give you a holler. Thanks for the offer!
 
Another question...I am working offline now to do this CSS template. So, when I test it, I get a message that says I am trying to run an ActiveX Control (and then "hit this, ok that, are your really sure you want to run this?" series of messages, which no one will click in real life).
That only happens in IE, not Firefox. The question is... is this happening because I am doing this offline and if the page was loaded to my webhost the message would go away? I did not get this message yesterday working off the server, so I am assuming it is because I am working off my own hard drive. Yes? No?
BTW, figured out the other problem, I was trying to control the centering in the wrong element. That is all fixed now (I hope!)
OK, moved it all to the server and the ActiveX messages went away.
 
Another question...I am working offline now to do this CSS template. So, when I test it, I get a message that says I am trying to run an ActiveX Control (and then "hit this, ok that, are your really sure you want to run this?" series of messages, which no one will click in real life).
That only happens in IE, not Firefox. The question is... is this happening because I am doing this offline and if the page was loaded to my webhost the message would go away? I did not get this message yesterday working off the server, so I am assuming it is because I am working off my own hard drive. Yes? No?
BTW, figured out the other problem, I was trying to control the centering in the wrong element. That is all fixed now (I hope!)
OK, moved it all to the server and the ActiveX messages went away..
The Active X message was likely something else you had on the page, and it was triggering a warning because you were crossing zones. Running the page locally but accessing plugin content that was trying to go contact the internet zone. When running on the server and you browse to it, you the page and the active x content are both within the internet zone so there is no issue.
I doubt very much that it had anything to do with your move to css.
 
A question...with Catlady's help, I am trying to use a template for CSS. I am trying to center an element. I have set a width for an element I will call 'content'. Altho I have been able to get it to stop hugging the left margin, it will not center. I cannot make it hug the right margin, so something tells me I have not really figured out how to do this.
So, here's what I have.
#content{
/*margin-left:auto;
margin-right:auto;*/
width: 817px;
text-align: center;
background-color: #ffffff;
background-position:center top;
}
I tried using the margins set to auto, to no avail, so they are commented out.
What I get is that content element slightly left of center. I've been using the W3 CSS tutorial to find answers, but I'm not succeeding.
Using this page for info
This isn't really what I started out to do this weekend, but what the heck. Anyone who's been around knows I go at this every year at least once!
My initial grief was trying to load a premade CSS template into FrontPage. It got all squiffy right off and I've been trying to work back from there..
Yes what you had with margin auto for the left and right is the right idea, just keep in mind it centers it based on the actual width of the block so if the block can't get out to 817px, because of something else restricting /crowding it, then the block will center within the space given, which will make it look off center. As GoInnStyle suggested.
 
Back at it again...
how do I add a drop shadow around the entire content area? Let's say my background is red and my content area is white and I want to add the shadowing around the content area so it 'lifts off' the red background- do I create another layer of background that is slightly larger than the content area or is there a CSS 'command' to do the shadow? I can only find one for text.
Thanks. This is taking me awhile but I'm learning stuff. Will post a somewhat finished 'product' when I'm happier with it.
 
BTW, meant to add, forget the side by side tables, I leapt into the CSS thing and the <div> commands and most of the elements are moving where I want them. Not all, some are persnickety. (Yes, I know, it's my problem they won't play nicely with each other.)
 
Back at it again...
how do I add a drop shadow around the entire content area? Let's say my background is red and my content area is white and I want to add the shadowing around the content area so it 'lifts off' the red background- do I create another layer of background that is slightly larger than the content area or is there a CSS 'command' to do the shadow? I can only find one for text.
Thanks. This is taking me awhile but I'm learning stuff. Will post a somewhat finished 'product' when I'm happier with it..
There are no great ways to do drop shadows in css. There are some tricky ways but they basically involve putting your content box inside a box that is just a wee bit larger and make that box the color of your "shadow" then adjust the padding of the outer box to make the inner box sit flush upper and flush left (if you want the drop shadow to appear to the bottom right.
 
Back at it again...
how do I add a drop shadow around the entire content area? Let's say my background is red and my content area is white and I want to add the shadowing around the content area so it 'lifts off' the red background- do I create another layer of background that is slightly larger than the content area or is there a CSS 'command' to do the shadow? I can only find one for text.
Thanks. This is taking me awhile but I'm learning stuff. Will post a somewhat finished 'product' when I'm happier with it..
There are no great ways to do drop shadows in css. There are some tricky ways but they basically involve putting your content box inside a box that is just a wee bit larger and make that box the color of your "shadow" then adjust the padding of the outer box to make the inner box sit flush upper and flush left (if you want the drop shadow to appear to the bottom right.
.
Is there a way to create a background image and place that in the style sheet?
 
Back at it again...
how do I add a drop shadow around the entire content area? Let's say my background is red and my content area is white and I want to add the shadowing around the content area so it 'lifts off' the red background- do I create another layer of background that is slightly larger than the content area or is there a CSS 'command' to do the shadow? I can only find one for text.
Thanks. This is taking me awhile but I'm learning stuff. Will post a somewhat finished 'product' when I'm happier with it..
There are no great ways to do drop shadows in css. There are some tricky ways but they basically involve putting your content box inside a box that is just a wee bit larger and make that box the color of your "shadow" then adjust the padding of the outer box to make the inner box sit flush upper and flush left (if you want the drop shadow to appear to the bottom right.
.
That's pretty much what I read. Not sure I can really rely on all browsers to show everything the same way, so I went with a border. Which I am assuming just 'glues' itself to the edge of the element! But I have to take it into consideration in sizing everything because when I did add it, all the elements started migrating east.
 
Back
Top