5 replies to this topic

[Possum]

After not being able to get 3.2 exactly how I want it, I've decided to run a 3.1.4 board instead. I'll go back to the current version when I have enough web design skills to modify it properly. Anyway, I'm having a devil of a time trying to modify the header and table width of my new forum's skin, "Grey Lustrous". When I widen the header it stretches out to the right, as pictured.



I want the left and right edges of the header to be flush with the left and the right sides of the light-blue container. But no matter what css code I use to center the header, I get the above result. This is the code I'm currently using.

#header {
position: relative;
width: 1020px;
margin-left: auto;
margin-right: auto;
}

A similar thing happens to the tables, which I want to widen so that there's only 10 px padding between the left and the right sides and the outer edges of the container, The right side expands and, in the case of the tables, is cropped in the process.

I know there's some code interfering with all this, but I don't know what it is. If you could steer me in the right direction, I'd be grateful.

Many thanks!

P.S. I'm running the board on my computer at the moment, so I can't provide a link to it. I've attached the styles template if you need to look at it.

Attached Files

•  ipb314styles.txt   73.48K   11 downloads

[Broni]

I need to see live board to play with it.

However...
1. Using fixed width is never a good idea as it'll look different in different screen resolutions.
2. Instead of this:
margin-left: auto;
margin-right: auto;

use:

margin: 0 auto;

[Possum]

That code didn't work, I'm afraid.

This did (kind of):

#header {
position: absolute;
width: 100%;
left: 0;
right: 0;
}

Unfortunately, it also caused the table to move up into the header.

[Broni]

As I said, when have it up and live I can take another look.

[Possum]

Managed to fix it by changing the width of the container and then the size of the padding.

[Broni]

Cool beans :)