SitePoint Sponsor

User Tag List

Results 1 to 10 of 10
  1. #1
    SitePoint Enthusiast Qubito's Avatar
    Join Date
    Sep 2003
    Location
    Mexico
    Posts
    98
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    I want to switch embeed css to import css but is not working

    HI I was designing a page with embeed css rules. because when done. i would cut the rules and put in a .css file and then import. however when i do this the design is not working could anyone help me ?


    here the code

    original embeed css rules

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <html>
    <head>
    <title>Diestro Consulting Mexico</title>
    <link rel="stylesheet" href="css/layout.css" />

    </head>
    <style>

    body {

    background-image: url(imagenes/fondoazul.png);
    margin: 0px;
    padding: 0px;
    width: 100%;
    height: 100%;
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    font-size: 13px;
    line-height: 150%;

    }
    h1 {
    font-size: 170%;
    color: #333399;
    font-weight: normal;

    }
    h2 {
    font-size: 110%;
    color: #B26C38;
    }

    p {
    font-size: 100%;
    color: #19194F;
    }
    p blanco {
    color: White;
    }
    ltx {
    font-size: 160%;
    font-style: italic;
    font-weight: bold;
    color: #B8860B;
    text-decoration: underline;
    }

    #PageContainer {
    background-color: White;
    width: 740px;
    height: 886px;
    margin-bottom: 10px;
    margin-top: 40px;
    margin-left: auto;
    margin-right: auto;
    }

    #logoupleft {
    background-image: url(imagenes/navdiestrooptz.png);
    height: 151px;
    width: 740px;
    float: left;
    }</style>
    <body>
    <div id="PageContainer">
    <div id="logoupleft"></div>

    </div>


    </body>
    </html>


    -------------------------------------------------------------------


    version with external .css

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <html>
    <head>
    <title>Diestro Consulting Mexico</title>
    <link rel="stylesheet" href="css/layout.css" />

    </head>

    <body>
    <div id="PageContainer">
    <div id="logoupleft"></div>

    </div>


    </body>
    </html>

    ----------------------------------------------------------------------

    .css file layout.css with is inside a folder called css which is inside the root directory of the site


    body {

    background-image: url(imagenes/fondoazul.png);
    margin: 0px;
    padding: 0px;
    width: 100%;
    height: 100%;
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    font-size: 13px;
    line-height: 150%;

    }
    h1 {
    font-size: 170%;
    color: #333399;
    font-weight: normal;

    }
    h2 {
    font-size: 110%;
    color: #B26C38;
    }

    p {
    font-size: 100%;
    color: #19194F;
    }
    p blanco {
    color: White;
    }
    ltx {
    font-size: 160%;
    font-style: italic;
    font-weight: bold;
    color: #B8860B;
    text-decoration: underline;
    }

    #PageContainer {
    background-color: White;
    width: 740px;
    height: 886px;
    margin-bottom: 10px;
    margin-top: 40px;
    margin-left: auto;
    margin-right: auto;
    }

    #logoupleft {
    background-image: url(imagenes/navdiestrooptz.png);
    height: 151px;
    width: 740px;
    float: left;
    }



    so when I did the external .css it does not show anything in the browser


    thanks for your help

  2. #2
    CSS & JS/DOM Adept bronze trophy
    Join Date
    Mar 2005
    Location
    USA
    Posts
    5,482
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Code:
     <link rel="stylesheet" type="text/css" href="css/layout.css" />
    Giving us a URL would help.
    We miss you, Dan Schulz.
    Learn CSS. | X/HTML Validator | CSS validator
    Dynamic Site Solutions
    Code for Firefox, Chrome, Safari, & Opera, then add fixes for IE, not vice versa.

  3. #3
    SitePoint Enthusiast Qubito's Avatar
    Join Date
    Sep 2003
    Location
    Mexico
    Posts
    98
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    hi
    here is the link

    http://www.contenido.net/diestro/test.html (this have the external layout.css)

    http://www.contenido.net/diestro/ (here the idea on how the layout should be shown)

  4. #4
    CSS & JS/DOM Adept bronze trophy
    Join Date
    Mar 2005
    Location
    USA
    Posts
    5,482
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Try adding some actual text to the test page.
    We miss you, Dan Schulz.
    Learn CSS. | X/HTML Validator | CSS validator
    Dynamic Site Solutions
    Code for Firefox, Chrome, Safari, & Opera, then add fixes for IE, not vice versa.

  5. #5
    SitePoint Enthusiast Qubito's Avatar
    Join Date
    Sep 2003
    Location
    Mexico
    Posts
    98
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    done text had added

  6. #6
    CSS & JS/DOM Adept bronze trophy
    Join Date
    Mar 2005
    Location
    USA
    Posts
    5,482
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You need the "./" because the path is relative to the current directory, not your web root.
    You also need to specify the mime-type.

    Code:
    <link rel="stylesheet" type="text/css" href="./css/layout.css" />
    We miss you, Dan Schulz.
    Learn CSS. | X/HTML Validator | CSS validator
    Dynamic Site Solutions
    Code for Firefox, Chrome, Safari, & Opera, then add fixes for IE, not vice versa.

  7. #7
    SitePoint Enthusiast Qubito's Avatar
    Join Date
    Sep 2003
    Location
    Mexico
    Posts
    98
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thanks
    how I specify the mime-type? could you give an example. and where it should be in the test.html page?

    bye the way. i made another page with other domain and at this it works fine. without the ./ and is relative to the current directory. please check

    http://contenido.net/qubo3/NQUBO3.html

  8. #8
    CSS & JS/DOM Adept bronze trophy
    Join Date
    Mar 2005
    Location
    USA
    Posts
    5,482
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That's what the type attribute is for. (I alread gave you the example.)

    Look at the difference between the image paths used in the two different CSS files.

    Apparently it was the image paths being incorrect, not the CSS. You just didn't do anything in the CSS to make it obvious if it had loaded without the images.
    We miss you, Dan Schulz.
    Learn CSS. | X/HTML Validator | CSS validator
    Dynamic Site Solutions
    Code for Firefox, Chrome, Safari, & Opera, then add fixes for IE, not vice versa.

  9. #9
    SitePoint Enthusiast Qubito's Avatar
    Join Date
    Sep 2003
    Location
    Mexico
    Posts
    98
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thanks a lot kravvitz.

    I now put the images that were in the layout.css not relative but directo ex http://contenido.net/diestro/imagenes/etc.png and you are right the css was fine. but it didnt push the images and that make that not appears anything.

    so when i use relative paths? I always must use ./ and specify the mime type?

  10. #10
    CSS & JS/DOM Adept bronze trophy
    Join Date
    Mar 2005
    Location
    USA
    Posts
    5,482
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The mime-type is a separate issue. It should always be included.

    The paths depend on where the different files are in relation to each other and to web root. The './' just means that the path is relative to the current directory.
    We miss you, Dan Schulz.
    Learn CSS. | X/HTML Validator | CSS validator
    Dynamic Site Solutions
    Code for Firefox, Chrome, Safari, & Opera, then add fixes for IE, not vice versa.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •