Good morning:
I'm running into an issue with what appears to be a padding issue when changing a layout from "XHTML Transitional" to "HTML5". Here is a screen shot of the same page in XHTML:
[attachment=1:2i146yj5]screenshot_xhtml.jpg[/attachment:2i146yj5]
The image at the top is a custom HTML module and both it and the ce_element image below it are contained within the fieldset border in a grid_4 300px wide container:
Code:
[img]tl_files/badassdash/images/template/dash_board_273.png[/img]
Here are the same two images when the Page Layout is changed to HTML5:
[attachment=0:2i146yj5]screenshot_html5.jpg[/attachment:2i146yj5]
The ce_image element blows out the width of the container, but the custom HTML does not. When I compare the frontend/ce_image.xhtml template and the ce_image.html5 templates, there is a line of code in the XHTML template that reads:
Code:
<div class="image_container"<?php if ($this->margin): ?> style="<?php echo $this->margin; ?>"<?php endif; ?>>
and in the HTML5 template it reads:
Code:
<figure class="image_container"<?php if ($this->margin): ?> style="<?php echo $this->margin; ?>"<?php endif; ?>>
What is causing the padding issue to change between the two? I believe the problem involves the "figure" element somehow. I'm not having any luck finding this. Any suggestions? Is there a CSS setting or change I should modify to fix this in the HTML5?
Ernest McDermon
Snellville, GA
Bookmarks