unwanted markup before module

[seadhna]

Hi there,
using Nautilus, when loading modules on frontpage, the following markup is appearing before the line: <div class="module">

<div style="margin:0; padding:0;">
<div style="margin:0 0 10px 0; padding:0;">

Where is this is the core files so that I can delete it. It is giving an unwanted border, and not sure why it is there because this can be taken care of in css.

this is what is creating the above markup:

if ($dignity->showColumn() == true) {
            echo '<div class="dignity_maincol">'."\n";
            $eDoc->component();
            echo "</div>\n";
            echo '<div class="dignity_sidecol">'."\n";
            $eDoc->modules('left');
            $eDoc->modules('right');
            echo "</div>\n";
            echo '<div class="clear"></div>'."\n";
         } else {
            $eDoc->component();
            echo '<div class="clear"></div>'."\n";
         }

[datahell]

This is a block of code from template Delta renamed as digntity. Why dont you people develop your own template? Renaming template delta does not means you have built a new template...
Such elements by the the templat are for the layout. If you remove them the layout will break. I think it is obvious...

[seadhna]

Hi - I am trying to learn the new CMS and making changes to one of the default templates to do it, which has been renamed 'dignity'.
We are not trying to create a new template.

The markup we are trying to find out where it comes from is this part:

<div style="margin:0; padding:0;">
<div style="margin:0 0 10px 0; padding:0;">

which is not in the template.

[datahell]

If it is on the frontpage then they may be from the Elxis frontpage designer. It would help to understand the exact spot if you pasted more html code arround these 2 lines.

[seadhna]

Hi again - it comes just before the first published module - regardless of which module is first - i.e. before the first:
<div class="module">

[datahell]

Can you paste a little more html code?
1 line is nothing...
<div class="module"> is being displayed in many areas, can't tell from that. Either post  a bigger html code block or provide a link. I dont care about the actual content, you can remove it if you like. I need to see just the markup.

[seadhna]

ok sure - if using the Delta template - it looks like this when the homepage renders: (thanks for having a look): mystery markup is at the end of this chunk:

<div class="delta_wrapper">
      <div class="delta_page">
         <div class="delta_head">
            <div class="delta_head_logo">
               [logo goes here]
            </div>
            <div class="delta_head_position">
               <div class="delta_pad5">
                                 </div>
            </div>
            <div class="delta_head_position">
               <div class="delta_pad5">
                  <form name="fmmodsearch" id="fmmodsearch" class="elx_modsearchform" action="[domain]/search/content.html" method="get">
<input type="text" name="q" id="msearchq" size="20" class="elx_modsearch_input" value="Search..." dir="ltr" onfocus="msearch_clear(1);" onblur="msearch_clear(0);" />
</form>
<span id="msearch_abase" style="display:none; visibility:hidden;">[domain]/search/</span>
<span id="msearch_ubase" style="display:none; visibility:hidden;">[domain]</span>
<span id="msearch_sear" style="display:none; visibility:hidden;">Search...</span>
               </div>
            </div>
            <div class="clear"></div>
            <div class="delta_menu">
               
<ul class="elx_menu">
   [menu items here]
            </div>
            <div class="clear"></div>
         </div>
         <div class="delta_main">
<div style="margin:0; padding:0;">
<div style="margin:0 0 10px 0; padding:0;">
<div class="module">

[seadhna]

another unwanted line appears on the category: <div style="margin:0; padding:0;">
which is a CSS issue...

<div class="elx_category_page" id="elx_category_page_2">
<div style="margin:0; padding:0;">

[datahell]

As I guessed it is from the frontpage designer in component content.
File: components/com_content/views/fpage.html.php

<div style="margin:0; padding:0;"> is imported by the openWrapper method (line 60)

<div style="margin:0 0 10px 0; padding:0;"> is imported by the renderCenter method (the exact line depends on the chosen layout)

Why are these css issues? I don't get it. In-line css is to make sure the imported blocks will fit nicely in your template. Although we have a global reset for margin and padding in the standard.css it is not sure that these values wont have been overwritten by other css files, so margin=0 and padding=0 are recommended there. You can style these areas by setting a module css suffix, not by modifying the core layout.

[seadhna]

thanks, i'll try to find now - it just seems unnecessarily messy to be including lines like this, don't you think? especially when they prevent a design from being responsive - e.g. i've just noticed another unwanted line - adding a margin of 5px to the div class="elx_content_imagebox". This is no good for a responsive design that works in ems and percentages.

[datahell]

Elxis generates automatically the layout. These markings are important in most cases. They are not required if you select to display only one cell in frontpage layout. Why not to use pixels to provide down space? Responsive design does not use px? It is the most accurate measuring meter, and in the case of an automatic layout we need an accuracy of 1 px, something that ems and percentage can't provide. I really don't understand you...

[seadhna]

Hi again, responsive design is the current reality for all cutting-edge sites and the future for all sites. Pixels are for fixed-width designs - which were great back in the days when most people used one of a small number of resolutions, there were no such things as ipads or smart phones. Layouts and text sizes have typically been expressed in pixels. Designers love pixels. Photoshop loves pixels. But a pixel can be one dot on one device and eight dots on another. So how do you approach responsive Web design if everything is pixel-based? You might not like the answer: You stop using pixel-based layouts and start using percentages or the em for sizing. By basing text sizes, widths and margins on percentages or on the em, a unit of measurement based on a font’s point size, you can turn a fixed size into a relative size.

[seadhna]

p.s. ems can be expressed as decimals for greater accuracy: e.g. 0.01em

[datahell]

My last reply, because we have gone out of topic...

0.0001 ems can not be 1.2 or 0.7 pixels. They will finally rounded near the nearest integer in pixels. When you round something you loose accuracy, got it? On the other hand, 7 pixels can be exactly 0.004343ems. So, which one is the most accurate? The greatest accuracy is pixels. Everything else is an intermediate meter and converted during rendering time into pixels by the browser's engine. Your screen resolution is in pixels. Percentage, ems, centimetres, picas, miles, feet, whatever, is converted finally to pixels. Ems and percentage have the advantage that suits better into different screens, but for accuracy: pixels is the king, period.

[seadhna]

Hi, I can understand why you like using pixels, but my personal opinion is that they should not be used in responsive designs, and a large part of the developer community would agree with me. But different opinions is what makes the world so interesting! Enjoying getting to grips with the new CMS by the way.