You need to Register for free and Login to post a message in the forum.

Forum

Subject: Custom HTML Skin - link module center overridden with left align
Prev Next
You are not authorized to post a reply.

Author Messages
aggiedan97
Nuker
Nuker
Posts:19

01 Jul 2008 10:52 PM  

DNN 4.7.01
Browser: Firefox 2.x
Attached Custom HTML skin file, CSS file,
Note - container skin = dnn blue (to simplify)

Skins don't get more simple than this.  I have attempted to clean up many of the HTML tags and move them to the CSS file.  In doing so, I seemed to have made the 'Links' module content not able to "center" as it would before I started to make changes.

The panes in question are the RightPane and LeftPane.  Both contain different Links modules with a single entry each.

The HTML for this section includes:
< table cellpadding="0" cellspacing="0" width="100%" border="0" >
    < tr
>
        < td class="contentpane" id="ContentPane" runat="server" align="center" colspan="2" >< /td
>
   
< /tr
>
    < tr
>
        < td align="center" class="leftpane" id="LeftPane" runat="server" >< /td
>
        < td align="center" class="rightpane" id="RightPane" runat="server" >< /td
>
    < /tr
>
< /table
>

The CSS for these classes include:

.leftpane
{
width: 50%;
background-color: transparent;
padding-left: 6px;
padding-right: 4px;
padding-top: 6px;
vertical-align: top;
text-align: center
}

.rightpane
{
width: 50%;
background-color: transparent;
padding-left: 6px;
padding-right: 4px;
padding-top: 6px;
vertical-align: top;
text-align: center
}

I have commented out most of the other 'text-align' in the CSS to no avail.   (Please see the attached CSS for more details.)

I used the dnn-blue container: image headder with color background, to simplify things.


Attachment: 171543231554.zip

leesykes
Nuke Master II
Nuke Master II
Posts:2951

02 Jul 2008 4:07 AM  
This was an interesting one!

The problem comes with how you add a module to the page.

When you add a module, there is the align option. - Select 'None Specified'

This will allow the correct styling to come from the skin.css

I experimented with using align center when adding a module, but this did not work. - View the page source to see how DNN adds additional classes into the module area

and the align classes are specified in the default.css

/* used to set the different module align options - from module settings */
.DNNAlignleft
{
    text-align: left;
}
.DNNAlignright
{
    text-align: right;
}
.DNNAligncenter
{
    text-align: center;
}

I discovered if I removed these classes, DNN modules aligned correctly, so selecting 'none specified' avoids using these classes.

Lee Sykes
Site Administrator
Subscribe to the website : DotNetNuke Video Tutorials : The Skinning Toolkit : DotNetNuke Podcasts
aggiedan97
Nuker
Nuker
Posts:19

02 Jul 2008 5:25 AM  

As suggested, I changed the module align settings to 'Not Specified' under the module > Settings > Page Settings > Alignment.

In Internet Explorer - no worries; Firefox 2.x - worries.

Interestingly, when in Edit mode the links text aligns center as desired, but in view mode it aligns left. When I view source < a class="Normal"... > is assigned to the actual link anchor for the entry.  See below:

< !-- End_Module_392 -- >
< /div >< /span >
< /td >

                            < /tr >
                            < tr >
                                < td id="dnn_LeftPane" class="leftpane" align="center" >< a name="377" >< /a >< span id="dnn_ctr377_ContentPane" >< !-- Start_Module_377 -- >< div id="dnn_ctr377_ModuleContent" >
 < div id="dnn_ctr377_Links_pnlList" >

  
    < table id="dnn_ctr377_Links_lstLinks" cellspacing="0" cellpadding="0" summary="Links Design Table" border="0" style="border-collapse:collapse;" >
   < tr >
    < td valign="top" >
            < table border="0" cellpadding="4" cellspacing="0" >
                < tr >
                    < td nowrap >
                       
                       
                        < a class="Normal" href="/DNN4701_02/LinkClick.aspx?link=65&tabid=58&mid=377" target="_self" >Enter Site< /a >
                         

                       
                    < /td >
                < /tr >
                < tr >
                    < td >
                       
                    < /td >
                < /tr >
            < /table >
        < /td >
   < /tr >

  < /table >

 < /div >

< !-- End_Module_377 -- >
< /div >< /span >
< /td >

                                < td id="dnn_RightPane" class="rightpane" align="center" >< a name="378" >< /a >< span id="dnn_ctr378_ContentPane" >< !-- Start_Module_378 -- >< div id="dnn_ctr378_ModuleContent" >
 < div id="dnn_ctr378_Links_pnlList" >
  
    < table id="dnn_ctr378_Links_lstLinks" cellspacing="0" cellpadding="0" summary="Links Design Table" border="0" style="border-collapse:collapse;" >
   < tr >

    < td valign="top" >
            < table border="0" cellpadding="4" cellspacing="0" >
                < tr >
                    < td nowrap >
                       
                       
                        < a class="Normal" href="/DNN4701_02/LinkClick.aspx?link=61&tabid=58&mid=378" target="_self" >Enter Blog< /a >
                         
                       
                    < /td >
                < /tr >

                < tr >
                    < td >
                       
                    < /td >
                < /tr >
            < /table >
        < /td >
   < /tr >
  < /table >

 < /div >

< !-- End_Module_378 -- >

leesykes
Nuke Master II
Nuke Master II
Posts:2951

02 Jul 2008 5:46 AM  
I tested this in FF. - Does the links module display correctly when logged out?

Lee Sykes
Site Administrator
Subscribe to the website : DotNetNuke Video Tutorials : The Skinning Toolkit : DotNetNuke Podcasts
aggiedan97
Nuker
Nuker
Posts:19

02 Jul 2008 6:56 AM  
No it displays incorrectly when logged out.
leesykes
Nuke Master II
Nuke Master II
Posts:2951

04 Jul 2008 9:20 AM  
Not sure what is happening here, I tested again in FF2 in view mode and the links are centered.

I have attached a zip with the source code of my install along with the skin files so that you can double check the code for any differences,

Thanks,

Attachment: 174205842871.zip


Lee Sykes
Site Administrator
Subscribe to the website : DotNetNuke Video Tutorials : The Skinning Toolkit : DotNetNuke Podcasts
You are not authorized to post a reply.
Forums > Users Lounge > Everything Else > Custom HTML Skin - link module center overridden with left align



ActiveForums 3.7

Latest Forum Posts

RE: Query Regarding search fuctionality by kaustav_kar
Thanks for your help. Could you please tell me how to configure it?
Login page by shanny234
---resolved---
RE: Only registered users can access some parts of the module by nukedoubt
Solution Obtained !!!!!!!Follow the steps :To Checked In login mode as registered users or not - Do...
RE: Blog Module on 4.8.4 by bryan_homey
03.04.00 Thanks Bryan
RE: Repository template: YouTube by bryan_homey
Thanks!
RE: File Manager Upload (intermittent error) by dnnmq
banner_rotator.js is only 3KB.  This behavior was reported after we upgraded from 4.3.4 to 4.8.3.Bef...
RE: templates and modules by mmcinulty
Hi Bocheck back to issue 24 for info about page templates.about your other issue with modules login ...
templates and modules by cyborama
Hello Lee and Joe,My first question deals with templates.  I noticed in dotnetnuke apparently you ca...
News Feeds (RSS) module 4.0 ? by wolmar
I had some trouble with the old NewsFeeds module (the one coverd in tutorial) so i figured i'd insta...
style search CSS or XML by mmcinulty
CSS an XMLi was looking back at issue 29 about search styling. there was a skin i seen www.dnnskin.n...
RE: Query Regarding search fuctionality by jncraig
I believe that the Venexus search tools can be configured to do that.
RE: Create Bookmarks/Anchor Points/Page TOC by jncraig
I'm not aware of a module that does that. And, yes, you have to put the links in manually. I've us...
RE: Refreshing Bl... IE by jncraig
F5 reloads the page, but doesn't necessarily reload cached files associated with the page. CTRL-F5 ...
RE: Bitter Sweet Skin Menu by jncraig
No, I'm really not here 24/7. More like 16/7!
RE: News Feed from DNN Blog by aggiedan97
Thanks for the reply. I have tested with the XSL stylesheet specified and still no success. The Bl...
Create Bookmarks/Anchor Points/Page TOC by lb313
I am developing my first DNN site and have been doing some modifications to the skin I am using and ...
Query Regarding search fuctionality by kaustav_kar
Hi,On my site we have the search feature(dnn:search).  Right now when we search, the search is done ...
RE: Bitter Sweet Skin Menu by leesykes
You need to use the correct container for the content panes, otherwise the text will not display cor...
RE: Refreshing Bl... IE by leesykes
CTRL+F5 should do the trick - F5 by itself or refresh tends not to work.
RE: File Manager Upload (intermittent error) by leesykes
not sure - how large are the files?
DotNetNuke Modules
RSS Feeds