PostNuke: A Flexible Open Source Content Management System
home | forum | international support | contact us

Support Forum

Start Start search pnForum Search latest posts latest posts RSS RSS Login Login Register Register
to previous topic new topic Print topic

Start ::  Developers Corner ::  0.8 Theme Design ::  n00b CSS question for .8 theme rework

Moderated by: Support Team

Goto page : 1 | 2 Next Page
Bottom
n00b CSS question for .8 theme rework

  • Link to this postingPosted: 01.04.2008, 17:40
    Profile Homepage
    jaenosjelantru
    rank:
    pnHelper pnHelper
    registered:
     March 2005
    Status:
    offline
    last visit:
    30.04.08
    Posts:
    124
    Hi-

    I know I know, not a CSS support forum, but you guys are extremely smart and helpful and I'm really having a brain fart for the last two hours on this one.

    I am working on a modified Andreas08 theme for 0.8 and integrating a cool mac like bg image from itheme I stumbled onto. The problem is when I incorporate the bg into the theme, it displays differently based on the browser. In IE7, the bg appears fine but in FF, it is jacked. When I get it working in FF, IE7 is jacked.

    See the code below to see if you can tell me where I am messing up. This is the code that currently works in FF and not IE7:

    CSS-
    Code
    #page {
    background: url(../images/main-bg.jpg) no-repeat top center;
    margin: 0px auto;
    position: absolute;
    }

    #theme_page_container{
    width:90%;
    margin:100px auto;
    padding:1px 0;
    text-align:left;
    background:#ffffff;
    color:#303030;
    border:1px solid #999999;
    }


    HTML-
    Code
    <div id="page">

    <div id="theme_page_container">

      [Website Layout]

    </div>

    </div>



    This can be viewed working in FF and jacked in IE7 here: http://gmc.websitewelcome.com/~nexus/index.php

    When I change the CSS for the page element to relative, instead of absolute, the bg appears fine in IE7, but it is displayed underneath the theme_page_container element in FF. IF you have firebug, you can see what I mean by diabling the theme_page_container white bg.

    HELP!!!???!!!



    edited by: jaenosjelantru, Apr 01, 2008 - 11:42 AM
    Top
    Notify a moderator about a posting notify mod
  • Link to this postingPosted: 01.04.2008, 21:55
    Profile Homepage
    AmmoDump
    rank:
    pnProfessional pnProfessional
    registered:
     December 2003
    Status:
    offline
    last visit:
    08.05.08
    Posts:
    2635
    LOL... Well it looks good in FF2, Safari 3.1, and IE8. IE8(in IE7 emulation) looks horrid.




    -----
    -- David Pahl -- (PostNuke Support Team)

    <div id="me" class="none" style="none" />

    Top
    Notify a moderator about a posting notify mod
  • Link to this postingPosted: 02.04.2008, 13:27
    Profile Homepage
    espaan
    rank:
    pnHelper pnHelper
    registered:
     August 2003
    Status:
    offline
    last visit:
    09.05.08
    Posts:
    237
    Why don't you apply the background to the body?
    What are the CSS statement for the body?

    What you have now also looks good in IE6.

    BTW I like the bg image a lot icon_smile



    edited by: espaan, Apr 02, 2008 - 02:28 PM
    Top
    Notify a moderator about a posting notify mod
  • Link to this postingPosted: 02.04.2008, 14:46
    Profile Homepage
    kaffeeringe.de
    rank:
    pnProfessional pnProfessional
    registered:
     September 2002
    Status:
    offline
    last visit:
    11.05.08
    Posts:
    745
    Maybe it helps if you include at the bottom of the page:
    Code
    <!--[if IE]>
    <a href="http://www.mozilla-europe.org/en/products/firefox/">
    This site is optimized for proper browsers that support all standards. 
    Go away with your corporate shit piece of software.
    </a>
    <![endif]-->

    icon_evil
    -----
    best regards from Kiel, sailing city

    Steffen Voß

    Member of the PostNuke Steering Committee
    Visit: Kaffeeringe.de - Internet & Kreativität
    Top
    Notify a moderator about a posting notify mod
  • Link to this postingPosted: 02.04.2008, 15:00
    Profile
    Topiatic
    rank:
    pnProfessional pnProfessional
    registered:
     November 2003
    Status:
    offline
    last visit:
    09.05.08
    Posts:
    1530
    LMAO thanks Steffen, I needed that!

    -----
    viewTopiaryWorks($twWorks, $twRosterMaster)
    Top
    Notify a moderator about a posting notify mod
  • Link to this postingPosted: 02.04.2008, 16:13
    Profile Homepage
    AmmoDump
    rank:
    pnProfessional pnProfessional
    registered:
     December 2003
    Status:
    offline
    last visit:
    08.05.08
    Posts:
    2635
    kaffeeringe.deMaybe it helps if you include at the bottom of the page:
    Code
    <!--[if IE]>
    <a href="http://www.mozilla-europe.org/en/products/firefox/">
    This site is optimized for proper browsers that support all standards. 
    Go away with your corporate shit piece of software.
    </a>
    <![endif]-->

    icon_evil

    Why not expand the conditional to include the whole page icon_wink
    Also you should use some PN standards:

    Code
    <body>
    <!--[if IE]>
    <div id="crapbox">
    <a href="http://www.mozilla-europe.org/en/products/firefox/">
    <!--[pnml name=_PIECEOSHIT]-->
    </a>
    </div>
    <!--[else]-->
    // the rest of your page
    <![endif]-->
    </body>





    edited by: AmmoDump, Apr 02, 2008 - 11:16 AM
    -----
    -- David Pahl -- (PostNuke Support Team)

    <div id="me" class="none" style="none" />

    Top
    Notify a moderator about a posting notify mod
  • Link to this postingPosted: 02.04.2008, 22:41
    Profile Homepage
    jaenosjelantru
    rank:
    pnHelper pnHelper
    registered:
     March 2005
    Status:
    offline
    last visit:
    30.04.08
    Posts:
    124
    espaanWhy don't you apply the background to the body?
    What are the CSS statement for the body?

    What you have now also looks good in IE6.

    BTW I like the bg image a lot icon_smile edited by: espaan, Apr 02, 2008 - 02:28 PM


    The bg image is from the i-theme theme. I liked it a lot so I wanted to use it in this theme.

    Code
    *{margin:0; padding:0;}

    body{
    font:80% Verdana,Tahoma,Arial,sans-serif;
    line-height:1.4em;
    text-align:center;
    color:#303030;
    background: #42afdc url(../images/html-bg.gif) repeat-x;
    margin: 0 0;
    padding: 0 0;
    }

    Top
    Notify a moderator about a posting notify mod
  • Link to this postingPosted: 04.04.2008, 19:37
    Profile Homepage
    jaenosjelantru
    rank:
    pnHelper pnHelper
    registered:
     March 2005
    Status:
    offline
    last visit:
    30.04.08
    Posts:
    124
    Any ideas on how to apply this correctly for both FF and IE?

    I have it set up for IE currently but you can't see the bg image in ff because it is hidden behind the theme_page_container div.
    Top
    Notify a moderator about a posting notify mod
  • Link to this postingPosted: 04.04.2008, 22:02
    Profile Homepage
    AmmoDump
    rank:
    pnProfessional pnProfessional
    registered:
     December 2003
    Status:
    offline
    last visit:
    08.05.08
    Posts:
    2635
    Temporary link: http://kane.murrayavionic...x.php?&theme=andreas08

    works FF and IE8 (7 emulation mode)

    Is that what you are trying to do?



    edited by: AmmoDump, Apr 04, 2008 - 05:08 PM

    -----
    -- David Pahl -- (PostNuke Support Team)

    <div id="me" class="none" style="none" />

    Top
    Notify a moderator about a posting notify mod
  • Link to this postingPosted: 04.04.2008, 23:40
    Profile Homepage
    jaenosjelantru
    rank:
    pnHelper pnHelper
    registered:
     March 2005
    Status:
    offline
    last visit:
    30.04.08
    Posts:
    124
    DUH, that will work.

    It's not exactly what I wanted but it will work well enough. Especially since it works in all browsers..

    Thank you for the help, David.



    edited by: jaenosjelantru, Apr 04, 2008 - 05:41 PM
    Top
    Notify a moderator about a posting notify mod
  • Link to this postingPosted: 05.04.2008, 01:07
    Profile Homepage
    AmmoDump
    rank:
    pnProfessional pnProfessional
    registered:
     December 2003
    Status:
    offline
    last visit:
    08.05.08
    Posts:
    2635
    What exactly do you want?

    -----
    -- David Pahl -- (PostNuke Support Team)

    <div id="me" class="none" style="none" />

    Top
    Notify a moderator about a posting notify mod
  • Link to this postingPosted: 05.04.2008, 01:45
    Profile Homepage
    videokid
    rank:
    pnProfessional pnProfessional
    registered:
     March 2003
    Status:
    offline
    last visit:
    07.05.08
    Posts:
    806
    in parent div of theme_page_container div
    use the statement
    Code
    overflow: hidden;

    and it will show up in FF too
    - Igor



    edited by: videokid, Apr 05, 2008 - 02:46 AM
    -----
    Have a nice day
    PostNuke.be is currently running
    PN 0.8.0.0-RC3
    Top
    Notify a moderator about a posting notify mod
  • Link to this postingPosted: 05.04.2008, 03:20
    Profile Homepage
    jaenosjelantru
    rank:
    pnHelper pnHelper
    registered:
     March 2005
    Status:
    offline
    last visit:
    30.04.08
    Posts:
    124
    Code
    overflow: hidden;


    That did it!

    Perfect: http://gmc.websitewelcome...php?module=crpCalendar

    It looks great!
    Top
    Notify a moderator about a posting notify mod
  • Link to this postingPosted: 05.04.2008, 11:32
    Profile Homepage
    espaan
    rank:
    pnHelper pnHelper
    registered:
     August 2003
    Status:
    offline
    last visit:
    09.05.08
    Posts:
    237
    Nice icon_biggrin

    BTW Is your crpCalendar just the standard one?



    edited by: espaan, Apr 05, 2008 - 12:32 PM
    Top
    Notify a moderator about a posting notify mod
  • Link to this postingPosted: 05.04.2008, 14:32
    Profile Homepage
    jaenosjelantru
    rank:
    pnHelper pnHelper
    registered:
     March 2005
    Status:
    offline
    last visit:
    30.04.08
    Posts:
    124
    QuoteBTW Is your crpCalendar just the standard one?


    No; I "donated" some $$ (actually Euro's) to the developer to help me customize it for this website.

    Jami, the crpCalendar developer, is a great help and very much appreciated.
    Top
    Notify a moderator about a posting notify mod
Goto page : 1 | 2 Next Page

Start ::  Developers Corner ::  0.8 Theme Design ::  n00b CSS question for .8 theme rework

Main Menu

Extensions Database

Documentation

Development

Login





 


 Log in Problems?
 New User? Sign Up!

Donate to PostNuke

Donate to the PostNuke Foundation's Server Fund See the news article