Forum FAQForum FAQSearchSearch MemberlistMemberlist Forum ignore listForum ignore list RegisterRegister ProfileProfile Log in to check your private messagesLog in to check your private messages Log inLog in
CSS i HTML test border greška

 
Post new topic   Reply to topic    mi3dot.org Forum Index -> Client-side
View previous topic :: View next topic  
Author Message
[0_o]



Joined: 07 Jun 2007
Posts: 42

PostPosted: 01.03.2011 18:27    Post subject: CSS i HTML test border greška Add user to your forum ignore list Reply with quote

pozdrav svima,

stavio sam si border crvene boje na svaki div kad sam počeo
radit sajt da bolje vidim šta radim ali sad kad maknem border
cijeli layout mi se pomakne prema dolje i u FF i u IE, taj border
je unutar .container class-e "border:1px solid red;"
u glavnom css-u ovdje dolje, znači kad taj border
pobrišem jer mi više nije potreban cijeli sajt mi se
pomakne prema dolje, probao sam svašta ali
nemogu otkrit kako da to popravim, nisam baš
dobar u ovome kao što čete i vidit po mom kod-u Smile


glavni CSS:

Code:
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
   margin: 0;
   padding: 0;
   border: 0;
   outline: 0;
   font-weight: inherit;
   font-style: inherit;
   font-size: 100%;
   font-family: inherit;
   vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
   outline: 0;
}
body {
   line-height: 1;
   color: black;
   background: white;
}
ol, ul {
   list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
   border-collapse: separate;
   border-spacing: 0;
}
caption, th, td {
   text-align: left;
   font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
   content: "";
}
blockquote, q {
   quotes: "" "";
}

/* Fix up IE6 PNG Support */
img, #logo { behavior: url(iepngfix.htc); }



#main {
   background-color:#7b5436;
   background-image: url(images/bg.jpg);
   background-repeat: no-repeat;
   background-position:center top;
   width:100%;
}

#content {
   text-align: left;
}

.container {
   width:950px;
   margin:0 auto;
   border:1px solid red;
}

#header {
   margin-top:198px;
   background-image: url(images/header.jpg);
   background-repeat: no-repeat;
   background-position:center top;
   min-height:514px;
}

#logo {
   margin-top: 0px;
   margin-left: -10px;
   background: url(images/logo.png);
   background-repeat: no-repeat;
   height: 326px;
   width: 469px;
   position: absolute;
   z-index:100;
}

#slider {
   position: absolute;
   margin-top:315px;
   margin-left:24px;
   z-index:150;
}

ul#sprite_menu {
   width: 693px;
   list-style: none;
   position:absolute;
   margin-top:227px;
   margin-left:201px;
   z-index:200;
}

#footer {
   margin-top:100px;
   background-image: url(images/footer.jpg);
   background-repeat: no-repeat;
   background-position:center top;
   min-height:754px;
}

.text_block {
   padding:16px;
   width:630px;
   margin-left:30px;
   text-align: left;
}

#content_box {
}

body {
   background-color:#7b5436;
   font-family:Times new roman;
   color:#7f7d78;
   font-size:16px;
   line-height:19px;
   text-align: center;
   margin:0 auto;
}

h2 {
   margin:0px 0px 10px 0px;
   font-size:36px;
   font-family:Times new roman;
   color:#C29F75;
}

small {
   color:#000;
   font-weight:bold;
   font-size:11px;
   display:block;
   margin-bottom:15px;
}

a {
   color:#ffffff;
   text-decoration:none;
}
a:hover {
   text-decoration:underline;
   color: #C00;
}
p {
   margin: 0px 0px 15px 0px;
   color: #BE9869;
}

a.button {
   background:#32312f;
   padding:5px 10px 5px 10px;
   color: #ffffff;
   text-decoration: none;
   text-transform:uppercase;
   font-size:9px;
   line-height:25px;
}
a.button:hover {
   background:#007de2;
   border-color:#007de2;
}

meni CSS:
Code:

* { margin: 0; padding: 0; } /* Reset stuff */

ul#sprite_menu li { display: inline; }
   
ul#sprite_menu li a {
   display: block; float: left; height: 95px;
   background-image: url(menu-sprite.png); text-indent: -9999px;
}

   ul#sprite_menu li a.pocetna {
      width: 96px; background-position: 0 0;   
   }
   
   ul#sprite_menu li a.onama {
      width: 105px; background-position: -96px 0;   
   }
   
   ul#sprite_menu li a.ponuda {
      width: 103px; background-position: -199px 0;   
   }
   
   ul#sprite_menu li a.akcije {
      width: 101px; background-position: -304px 0;   
   }
   
   ul#sprite_menu li a.trgovine {
      width: 98px; background-position: -405px 0;   
   }
   
   ul#sprite_menu li a.zabavno {
      width: 97px; background-position: -503px 0;   
   }
   
   ul#sprite_menu li a.kontakt {
      width: 93px; background-position: -600px 0;   
   }
   
   ul#sprite_menu li a.pocetna:hover, ul#sprite_menu li a.pocetna:focus {
      background-position: 0 -94px;   
   }
   
   ul#sprite_menu li a.onama:hover, ul#sprite_menu li a.onama:focus {
      background-position: -96px -94px;   
   }
   
   ul#sprite_menu li a.ponuda:hover, ul#sprite_menu li a.ponuda:focus {
      background-position: -199px -94px;   
   }
   
   ul#sprite_menu li a.akcije:hover, ul#sprite_menu li a.akcije:focus {
      background-position: -304px -94px;   
   }
   
   ul#sprite_menu li a.trgovine:hover, ul#sprite_menu li a.trgovine:focus {
      background-position: -405px -94px;   
   }
   
   ul#sprite_menu li a.zabavno:hover, ul#sprite_menu li a.zabavno:focus {
      background-position: -503px -94px;   
   }
   
   ul#sprite_menu li a.kontakt:hover, ul#sprite_menu li a.kontakt:focus {
      background-position: -600px -94px;   
   }

a { outline: none; }


HTML:

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>NASLOV</title>
   
   <link rel="stylesheet" href="floom/floom.css" type="text/css" media="screen" charset="utf-8" />
    <link href="style.css" rel="stylesheet" type="text/css" />
    <link href="menu.css" rel="stylesheet" />
   
    <script type="text/javascript" src="iepngfix_tilebg.js"></script>
   <script type="text/javascript" charset="utf-8" src="mootools-core-1.3-full-nocompat.js"></script>
    <script type="text/javascript" charset="utf-8" src="mootools-more.js"></script>
    <script type="text/javascript" charset="utf-8" src="floom/floom.js"></script>
    <script type="text/javascript" charset="utf-8">
        window.addEvent('domready', function(e){
           
            // option 1      
            var slides = [
                {
                    image: 'nature-photo0.jpg',
                    caption: 'Ova slika je super'
                },
            ];
           
            // option 2
            // var slides = $$('#blinds img');

            $('blinds').floom(slides, {
                slidesBase: 'slides/',
                sliceFxIn: {
                    left: [20, 0]
                }
            });
           
        });
    </script>

</head>

<body>
    <div id="main">
        <div class="container">
            <div id="menu">
               <ul id="sprite_menu">
               <li><a href="#pocetna"    class="pocetna">pocetna</a></li>
               <li><a href="#onama"    class="onama">o nama</a></li>
               <li><a href="#ponuda"    class="ponuda">ponuda</a></li>
               <li><a href="#akcije"    class="akcije">akcije</a></li>
               <li><a href="#trgovine" class="trgovine">trgovine</a></li>
               <li><a href="#zabavno"    class="zabavno">zabavno</a></li>
               <li><a href="#kontakt"    class="kontakt">kontakt</a></li>
            </ul>
            </div>
          <div id="logo"></div>
              <div id="slider">
            <div id="blinds-cont">
               <div id="blinds"></div>
            </div>
         </div>
           <div id="header"></div>
         </div>
   </div>

    <div id="content">
        <div class="container">
           <div id="content_box">
                <div class="text_block">
                  <h2>OVO je naslov h2</h2>
                    <small>Napisao <a href="">ja</a> tagged <a href="">ovo</a>, <a href="">ono</a></small>

                    <p>Tekst tekst tekst </p>
                    <br />
                    <a href="" class="button">Više o ovome</a>
                </div>
            </div>       
        </div>
    </div>

    <div id="footer">
       <div class="container">
           Footer Stuff Goes in Here
        </div>
    </div>

</body>
</html>
Back to top
View user's profile Send private message
nel`chee



Joined: 08 Jul 2004
Posts: 2087
Location: Rijeka

PostPosted: 01.03.2011 20:15    Post subject: Add user to your forum ignore list Reply with quote

postavi to negdje online da vidimo.

_________________
art & design portfoliofree Photoshop brushes stuffsketchblogfacebook
Back to top
View user's profile Send private message Visit poster's website Twitter profile
Moebius



Joined: 26 Jan 2004
Posts: 245
Location: zagreb

PostPosted: 01.03.2011 20:23    Post subject: Add user to your forum ignore list Reply with quote

u css-u izbrisi ovo iz #header deklaracije:
Code:
    margin-top: 198px;
    min-height: 514px;


Nema ti to veze s borderima.
Ako radis u FF-u, upoznaj svojeg najboljeg prijatelja - ako se mislis baviti ovim poslom:
http://getfirebug.com/

Ako ti je to stran teren, evo malo uvoda:
http://www.youtube.com/watch?v=FsX6qwQqGgQ

Zapravo bez Firebuga FF i nije nis posebno Cool
Back to top
View user's profile Send private message Visit poster's website
[0_o]



Joined: 07 Jun 2007
Posts: 42

PostPosted: 01.03.2011 20:30    Post subject: Add user to your forum ignore list Reply with quote

http:// zbrisao sam link dok ne napravim dalje

evo ga online, s ovim sam se namučio jako nije trebao tako izgledat ali sam napravio prekompliciran dizajn pa nisam mogao dobit šta sam htio, još imam puno posla ali sad sam ovdje zapeo i loše mi je Sad

Moebius probao sam ovo izbacit šta si rekao ali onda mi nestane taj div u kojem mi je ta slika ovaj papir ispod, znam da sam zakomplicirao s tim divovima al nikako da drukcije dobijem da ovako izgleda

Last edited by [0_o] on 08.03.2011 14:06; edited 1 time in total
Back to top
View user's profile Send private message
Moebius



Joined: 26 Jan 2004
Posts: 245
Location: zagreb

PostPosted: 01.03.2011 20:47    Post subject: Add user to your forum ignore list Reply with quote

ok, sad vidim.
onda ovako:

Code:

#header {
    background-image: url("images/header.jpg");
    background-position: center bottom;
    background-repeat: no-repeat;
    min-height: 712px;
}


Primjeti da nema top margine, da je min-height povecan za taj iznos, i da je background pozicioniran bottom.
Back to top
View user's profile Send private message Visit poster's website
[0_o]



Joined: 07 Jun 2007
Posts: 42

PostPosted: 01.03.2011 20:53    Post subject: Add user to your forum ignore list Reply with quote

ok sad sve radi kako sam zamislio, puno hvala, ako zapnem opet pa vas cimnem ovdje

ako imate kakvih primjedbi s ovim sajtom slobodno pišite, možda nešto naučim šta krivo radim Wink
Back to top
View user's profile Send private message
[0_o]



Joined: 07 Jun 2007
Posts: 42

PostPosted: 01.03.2011 21:04    Post subject: Add user to your forum ignore list Reply with quote

dodao sam još i ovaj kod, misli da bi tako trebaolo raditi i na IE6?

Code:
#header {
   background-image: url(images/header.jpg);
   background-repeat: no-repeat;
   background-position:center bottom;
   height:auto !important;
   height:712px;
   min-height:712px;
}
Back to top
View user's profile Send private message
nel`chee



Joined: 08 Jul 2004
Posts: 2087
Location: Rijeka

PostPosted: 01.03.2011 23:13    Post subject: Add user to your forum ignore list Reply with quote

napravi posebni styesheet za IE6 i nećeš trebati takve hackove u kodu.
http://www.maratz.com/blog/archives/2005/06/16/essentials-of-css-hacking-for-internet-explorer/

_________________
art & design portfoliofree Photoshop brushes stuffsketchblogfacebook
Back to top
View user's profile Send private message Visit poster's website Twitter profile
[0_o]



Joined: 07 Jun 2007
Posts: 42

PostPosted: 04.03.2011 13:25    Post subject: Add user to your forum ignore list Reply with quote

nemam ie6 instaliran, ali sam gledao na onom browser testu i vidim da mi je cijeli sajt totalni raspad na ie6, znači koda se sve razbacalo na sve strane, koja bi bila najbolja solucija pošto imam windows 7, kako vi testirate odnosno radite code za IE6, dali imate instaliran IE6 i IE7i8 ili neka druga fora, jer čitao sam negdje da ako instliraš ie6 i ie7 da se tuku jedan s drugim u windows 7-mici
Back to top
View user's profile Send private message
Moebius



Joined: 26 Jan 2004
Posts: 245
Location: zagreb

PostPosted: 04.03.2011 13:43    Post subject: Add user to your forum ignore list Reply with quote

http://www.my-debugbar.com/wiki/IETester/HomePage
Back to top
View user's profile Send private message Visit poster's website
[0_o]



Joined: 07 Jun 2007
Posts: 42

PostPosted: 07.03.2011 00:13    Post subject: Add user to your forum ignore list Reply with quote

hvala ti puno, ovo je odlično! Cool

našao sam i ovo ako nekome zatreba, znači standalone verzije svih IE:
http://finalbuilds.edskes.net/iecollection.htm
Back to top
View user's profile Send private message
Aleks CS



Joined: 26 Nov 2010
Posts: 10

PostPosted: 07.03.2011 16:57    Post subject: Add user to your forum ignore list Reply with quote

Zaboravi IE6, cak i Microsoft odustao.

http://ie6countdown.com/
Back to top
View user's profile Send private message
[0_o]



Joined: 07 Jun 2007
Posts: 42

PostPosted: 08.03.2011 14:05    Post subject: Add user to your forum ignore list Reply with quote

misliš? a brijem da bih mogao, ali svejedno mi je sajt u raspadu u nekim drugim browserima
Back to top
View user's profile Send private message
[0_o]



Joined: 07 Jun 2007
Posts: 42

PostPosted: 15.03.2011 14:36    Post subject: Add user to your forum ignore list Reply with quote

ej pozdrav nije me bilo neko vrijeme, nisam ni radio na sajtu, sad imam problem kod IE7, znači navigacija (ul#sprite_menu) mi se pomakne u lijevo samo u ie7, u drugima je ok. code je isti ko ovaj gore u prvom postu
Back to top
View user's profile Send private message
Display posts from previous:   
Post new topic   Reply to topic    mi3dot.org Forum Index -> Client-side All times are GMT + 1 Hour
Page 1 of 1

 
Jump to:  
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum


Powered by phpBB © 2001, 2005 phpBB Group