Expand|Select|Wrap|Line Numbers
- <div id="backing">
- <div id="lbImgBacker">
- <center>
- <img id="Image1" src="banner.JPG" alt="" style="border-width:0px;" />
- </center>
- </div>
- <div id="ExampleLeftAlignElement" ></div>
- <!-- other elements and the rest of the page -->
- </div>
Expand|Select|Wrap|Line Numbers
- #backing
- {
- z-index: 100;
- position: static;
- display: block;
- width: 760px;
- background-color: #faebd8;
- text-align:left;
- }
- #Image1
- {
- z-index: 100;
- display: block;
- height: 127px;
- width: 756px;
- border-width: 0px;
- cursor: pointer ;
- }
- #lbImgBacker
- {
- z-index: 100;
- position: static;
- display: inline;
- text-align: center;
- width: 760px;
- height: 130px;
- color: #804000;
- background-color: Transparent;
- font-weight: bold;
- font-size: 12pt;
- }
The "text-align:left" in #backing is required for the rest of the page, and seems to override any child styles I attemp to apply.
For arguments sake, "lbImgBacker" is the same width as "backing" and doesn't matter if the text-align is left/center/right. But the image INSIDE "lbImgBacker" should be centered inside of it. This is what I cannot seem to do with style properties. That <center> tag is the only thing that does it, but is not allowed by W3 to be there.
Do I have an alternataive?