css template

1

css template

offline
  • Pridružio: 18 Dec 2007
  • Poruke: 95

imam css temlpate ali cim upisem neka od nasih slova razdesi se.Moze li mi neko pomoci?



Registruj se da bi učestvovao u diskusiji. Registrovanim korisnicima se NE prikazuju reklame unutar poruka.
offline
  • Software developer
  • Pridružio: 06 Sep 2005
  • Poruke: 3800
  • Gde živiš: Beograd

Razdesi se?
sta ti to znaci?

Jel ti stavljena kodna strana na utf8 na primer?



offline
  • Pridružio: 18 Dec 2007
  • Poruke: 95

am nerazumem!imam te neke template css i kad hocu neki tekst na srpskom da upisem kao đ ć i to on se sav razdesi izgubi pozadinu i ostale stvari na strani ostanu samo linkovi i tekst.

offline
  • Pridružio: 20 Dec 2004
  • Poruke: 2887
  • Gde živiš: Na Balkanu

Koji je encoding stranice?
Može neki link ili code?

offline
  • Pridružio: 18 Dec 2007
  • Poruke: 95

<html>

<head>

<meta name="Description" content="About your Company ..." />
<meta name="Keywords" content="your, keywords" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="Distribution" content="Global" />
<meta name="Robots" content="index,follow" />

<link rel="stylesheet" href="images/style.css" type="text/css" />

<title>Your Company Name</title>
</head>

<body>

<!-- header starts here -->
<div id="header"><div id="header-content">

<h1 id="logo-text"><a href="index.html" title=""><span>Guru Guru</span></a></h1>
<h2 id="slogan">Put your site slogan here</h2>

<div id="header-links">
<p>
<a href="index.html">Naslovna</a> |
<a href="index.html">Cnc kontrola</a> |
<a href="index.html">video nadzor</a> </p>
</div>

</div>
</div>

<!-- navigation starts here -->
<div id="nav-wrap"><div id="nav">

<ul>
<li id="current"><a href="index.html">Naslovna</a></li>
<li><a href="about.html">Proizvodi</a></li>
<li><a href="services.html">Usluge</a></li>
<li><a href="support.html">Novosti</a></li>
<li><a href="contact.html">Kontakt</a></li>
</ul>

</div></div>

<!-- content-wrap starts here -->
<div id="content-wrap"><div id="content">

<div id="sidebar" >

<div class="sep"></div>

<div class="sidebox">
<h1>Search Box</h1>
<form action="#" class="searchform">
<p>
<input name="search_query" class="textbox" type="text" />
<input name="search" class="button" value="Search" type="submit" />
</p>
</form>
</div>

<div class="sidebox">
<h1>Menu</h1>
<ul class="sidemenu">
<li><a href="index.html">Naslovna</a></li>
<li><a href="about.html">Proizvodi</a></li>
<li><a href="services.html">Usluge</a></li>
<li><a href="support.html">Novosti</a> </li>
<li><a href="contact.html">Kontakt</a></li>
</ul>
</div>

<div class="sidebox">
<h1>Latest News</h1>

<p>Porta vel, scelerisque eget, malesuada at, neque. Vivamus eget nibh. Etiam cursus leo vel metus. Nulla facilisi. Aenean nec eros. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae</p>
<p>Porta vel, scelerisque eget, malesuada at, neque. Vivamus eget nibh. Etiam cursus leo vel metus. Nulla facilisi. Aenean nec eros. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae</p>

<p class="align-right"><a href="index.html">Read More</a></p>
</div>

</div>

<div id="main">

<div class="box">

<a name="TemplateInfo"></a>
<h1><a href="index.html">Welcome to <span class="white">Our Site</span></a></h1>

<p>Porta vel, scelerisque eget, malesuada at, neque. Vivamus eget nibh. Etiam cursus leo vel metus. Nulla facilisi. Aenean nec eros. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Suspendisse sollicitudin velit sed leo. Ut pharetra augue nec augue. Nam elit magna, hendrerit sit amet, tincidunt ac, viverra sed, nulla. ,a.</p>
<p>Porta vel, scelerisque eget, malesuada at, neque. Vivamus eget nibh. Etiam cursus leo vel metus. Nulla facilisi. Aenean nec eros. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Suspendisse sollicitudin velit sed leo. Ut pharetra augue nec augue. </p>
<p class="post-footer align-right">
<a href="index.html" class="readmore">Read more</a></p>

</div>

<div class="box">

<a name="SampleTags"></a>
<h1><a href="index.html">About <span class="white">Us</span></a></h1>

<h3>Image and text</h3>

<p>
<a href="#"><img src="images/img.jpg" width="113" height="161" alt="firefox-gray" class="float-left" /></a>
<strong>Porta vel</strong>, scelerisque eget, malesuada at, neque. Vivamus eget nibh. Etiam cursus leo vel metus. Nulla facilisi. Aenean nec eros. <a href="#">Vestibulum ante</a> ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Suspendisse sollicitudin velit sed leo. Ut pharetra augue nec augue. Nam elit magna, <a href="#">hendrerit sit amet</a>, tincidunt ac, viverra sed, nulla. ,a. Quisque diam lorem,interdum vitae, dapibus ac, scelerisque vitae, pede. Donec eget tellus non erat lacinia fermentum.</p>
</div>

<br />

</div>


<!-- content-wrap ends here -->
</div></div>

<!-- footer starts here-->
<div id="footer-wrap">
<div id="footer-bottom">
<p>
© 2007 <strong>Your Company Name </strong> |
Valid <a href="http://validator.w3.org/check?uri=referer">XHTML</a> |
<a href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a>

      

<a href="index.html">Home</a> | 
<a href="index.html">Sitemap</a> | 
<a href="index.html">RSS Feed</a> </p>
</div>

<!-- footer ends-->
</div>

</body>
</html>

Dopuna: 15 Jan 2008 20:50

na ovo se poziva style.css


/* top elements */
* { padding: 0; margin: 0; border: 0; }

body {
margin: 0; padding: 0;
font: normal 12px/1.7em verdana, tahoma, sans-serif;
text-align: center;
background: #39396D url(headerbg.jpg) repeat-x 0 0;
color: #ffffff;
width: 778px;
}

/* links */
a {
color: #FFFF00;
background-color: inherit;
text-decoration: none;
}
a:hover {
color: #FFFF00;
background-color: inherit;
text-decoration: underline;
border: none;
}

/* headers */
h1, h2, h3 {
font: bold 1em 'Trebuchet MS', Tahoma, Arial, Sans-serif;
color: #fff;
}
h1 { font-size: 2.5em; }
h2 { font-size: 2em; text-transform:uppercase;}
h3 { font-size: 1.8em; }

p, h1, h2, h3 {
margin: 0;
padding: 10px 15px;
}

ul, ol {
margin: 10px 30px;
padding: 0 15px;
}

/* images */
img {
border: 0px;
padding: 6px;
}
img.float-right {
margin: .5em 0 1em 1em;
}
img.float-left {
margin: .5em 1em 1em 0;
}

code {
margin: .5em 0;
display: block;
padding: 20px;
text-align: left;
overflow: auto;
font: 500 1em/1.5em 'Lucida Console', 'Courier New', monospace ;
/* white-space: pre; */
background: #39396D;
border: 1px solid #39396D;
}
acronym {
cursor: help;
border-bottom: 1px solid #0065C6;
}
blockquote {
margin: 10px 15px;
padding: 10px 0 10px 28px;
border: 1px solid #39396D;
background: #39396D;
font: bold 1.3em/1.5em "Century Gothic", "Trebuchet MS", Helvetica, Arial, Geneva, sans-serif;
}

/* start - table */
table {
margin: 10px 15px;
border-collapse: collapse;
}
th strong {
color: #fff;
}
th {
background: #39396D;
height: 3em;
padding-left: 12px;
padding-right: 12px;
color: #FFF;
text-align: left;
border-left: 1px solid #ffffff;
border-bottom: solid 2px #ffffff;
border-top: solid 2px #ffffff;
border-right: 1px solid #ffffff;
}
tr {
color: #ffffff;
height: 2.5em;
}
td {
padding-left: 12px;
padding-right: 12px;
border-left: 1px solid #FFF;
border-bottom: solid 1px #ffffff;
border-right: 1px solid #ffffff;
}
td.first,th.first {
border-left: 0px;
border-left: 1px solid #ffffff;
border-right: 1px solid #ffffff;
}
tr.row-a {
background: #4E4E7C;
border-left: 1px solid #ffffff;
border-right: 1px solid #ffffff;
}
tr.row-b {
background: #4E4E7C;
}
/* end - table */

/* form elements */
form {
margin: 10px 15px;
padding: 10px;
border: 1px solid #39396D;
background-color: #39396D;
}
fieldset {
margin: 0;
padding: 0;
border: none;
}
label {
display:block;
font-weight:bold;
margin: .4em 0;
}
input {
padding: .3em;
border: 1px solid #eee;
font: normal 1em Verdana, sans-serif;
color:#777;
}
textarea {
width: 55%;
padding: .3em;
font: normal 1em/1.5em Verdana, sans-serif;
border: 1px solid #eee;
height: 10em;
display:block;
color:#777;
}
input.button {
font: bold 1em Arial, Sans-serif;
margin: 0;
padding: .25em .3em;
color: #000;
background: #FFFD00;
border: 2px solid #FFFD00;
}

/* search form */
.searchform {
background-color: transparent;
border: none;
margin: 0 0 0 10px; padding: 0 0 1.5em 0;
width: 18em;
}
.searchform p { margin: 0; padding: 0; }
.searchform input.textbox {
width: 11em;
color: #777;
padding: .4em;
border: 1px solid #FFFD00;
vertical-align: top;
}
.searchform input.button {
width: 60px;
vertical-align: top;
}

/***********************
LAYOUT
************************/

#header-content, #content, #nav {
/*
The width value below sets the total width of the design. It's default value is set to 93%
which means that it will take up 93% of the browser window's width. You can also set it to a
different percentage value (90%, 85%, etc.). This design is fluid layout by default, but you
can turn it into a fixed width layout by setting a pixel value to the width (e.g. 900px, 950px).
*/
width: 93%;
}

/* box */
.box {
margin: 10px 0;
padding: 10px 10px 20px 10px;
border: 5px solid #4E4E7C;
background: #4E4E7C;
}

/* header */
#header {
height: 178px;
text-align: left;
background: #39396D url(header.jpg) repeat-x 0 0;
}
#header-content {
position: relative;
margin: 0 auto; padding: 0;
}
#header-content h1#logo-text a {
position: absolute;
margin: 0; padding: 0;
font: bold 40px 'Trebuchet MS', Tahoma, Arial, Sans-serif;
letter-spacing: -1px;
color: #000;
text-decoration: none;

/* change the values of top and left to adjust the position of the logo*/
top: 30px; left: 10px;
}
#header-content h1#logo-text span {
color: #39396D;
}
#header-content #slogan {
position: absolute;
font: bold 16px 'Trebuchet Ms', Sans-serif;
text-transform: none;
color: #000;
margin: 0; padding: 0;

/* change the values of left and top to adjust the position of the slogan */
top: 75px; left: 175px;
}

/* header links */
#header-content #header-links {
position: absolute;
top:35px; right: 0px;
color: #39396D;
font: bold 15px "Trebuchet MS", Tahoma, Sans-serif;
}
#header-content #header-links a {
color: #39396D;
text-decoration: none;
}
#header-content #header-links a:hover {
color: #fff;
}


/* Navigation */
#nav-wrap {
float: left;
width: 100%;
background: url(menubg.jpg) repeat-x left bottom;
clear: both;
}
#nav {
clear: both;
margin: 0 auto;
padding: 0;
}
#nav ul {
float: left;
list-style: none;
text-transform: uppercase;
margin: 0;
padding: 0;
height: 64px;
}
#nav ul li {
float: left;
margin: 0; padding: 0;
height: 64px;
}
#nav ul li a {
display: block;
float: left;
width: auto;
margin: 0;
padding: 0 15px;
color: #FFF;
font: bold 14px 'Trebuchet MS', Tahoma, Arial, Sans-serif;
text-decoration: none;
letter-spacing: 1px;
}
#nav ul li a:hover,
#nav ul li a:active {
color: #FFFF00;
}
#nav ul li#current {
background: url(nav-current.jpg) no-repeat center bottom;
}
#nav ul li#current a {
color: #FFFF00;
}

/* content */
#content-wrap {
clear: both;
float: left;
background: #39396D;
width: 100%;
}
#content {
text-align: left;
padding: 0;
margin: 0 auto;
}

/* sidebar */
#sidebar {
float: right;
width: 21em;
margin: 10px 0 10px -21em; padding: 0;
}
#sidebar h1 {
font: bold 1.75em 'Trebuchet MS', Tahoma, Arial, Sans-serif;
padding: .3em 0 .5em 10px;
color: #FFFF00;
}
#sidebar ul.sidemenu {
list-style:none;
margin: 0;
padding: .3em 0 1em 5px;
font-family: 'Trebuchet MS', Tahoma, Sans-serif;
}
#sidebar ul.sidemenu li {
padding: 0;
background: url(sidebullet.gif) no-repeat .3em .5em;
}

* html body #sidebar ul.sidemenu li { height: 1%; }

#sidebar ul.sidemenu li a {
display: block;
font-weight: bold;
color: #E8F4FF;
text-decoration: none;
padding: .2em 0 .2em 30px;
line-height: 1.5em;
font-size: 1.35em;
}
#sidebar ul.sidemenu li a:hover {
background: #4E4E7C url(sidebullet.gif) no-repeat .25em .45em;
color: #FFF;
}
#sidebar ul.sidemenu ul{
margin-left: 15px;
}

#sidebar .sidebox {
margin: 5px 15px 5px 0;
padding: 0;
background: url(sidebarsep.jpg) repeat-x left bottom;
}
#sidebar .sep{
background: url(sidebarsep.jpg) repeat-x left bottom;
height: 2px;
margin: 0px 15px 10px 0;
clear: both;
}

/* main */
#main {
margin: 10px 23em 10px 0;
padding: 0;
}
#main h1 {
font: bold 2.8em 'Trebuchet MS', Arial, Sans-serif;
color: #FFFF00;
letter-spacing: -2px;
padding-bottom: 0;
}
#main h1 a {
color: #FFFF00;
text-decoration: none;
}

/* footer */
#footer-wrap {
clear: both;
border-top: 5px solid #F7B200;
text-align: left;
padding: 1.6em 0;
}
#footer-wrap a {
text-decoration: none;
color: #F9BE00;
font-weight: bold;
}
#footer-wrap a:hover {
color: #F9BE00;
}
#footer-wrap p {
padding: 10px 0;
}
#footer-wrap h2 {
color: #E8F4FF;
margin: 0;
padding: 0 10px;
text-transform: none;
}

/* bottom */
#footer-bottom {
clear: both;
color: #E8F4FF;
margin: 0 auto;
padding: 1em 0;
text-align: center;
}

/* alignment classes */
.float-left { float: left; }
.float-right { float: right; }
.align-left { text-align: left; }
.align-right { text-align: right; }

/* additional classes */
.clear { clear: both; }
.white { color: #E8F4FF; }

img.rssfeed {
border: none;
padding: 0 0 5px 0;
background: transparent;
}

.post-by {
font-size: .95em;
padding-top: 0;
}
.post-footer {
text-align: right;
background: #39396D;
border: 1px solid #FFFF00;
padding: 8px 10px;
margin: 20px 15px 10px 15px;
}
.post-footer .date {
background: url(clock.gif) no-repeat left center;
padding-left: 20px; margin: 0 3px 0 3px;
}
.post-footer .comments {
background: url(comment.gif) no-repeat left center;
padding-left: 20px; margin: 0 3px 0 3px;
}
.post-footer .readmore {
background: url(page.gif) no-repeat left center;
padding-left: 20px; margin: 0 3px 0 3px;
}

offline
  • lnenad  Male
  • Stručni saradnik
    Web
  • Nenad
  • Arhitetak
  • Pridružio: 16 Jan 2007
  • Poruke: 2860
  • Gde živiš: Bijeljina

Ako ukucas u CSS fajlu (primjer style.css) naravno da ce da se "razdesi" .
Ako zelis da promjenis tekst kucaj ga u html fajlu, a ne u css-u

offline
  • Pridružio: 18 Dec 2007
  • Poruke: 95

ne ne kucam u css fajlu negu u html skripti!

offline
  • Software developer
  • Pridružio: 06 Sep 2005
  • Poruke: 3800
  • Gde živiš: Beograd

probaj
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
da zamenis sa

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

offline
  • Pridružio: 24 Mar 2004
  • Poruke: 3962
  • Gde živiš: Zemun

za pocetak umesto ovog
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
stavi ovo
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

offline
  • Pridružio: 18 Dec 2007
  • Poruke: 95

ne radi zaboravio sam da kazem da snimam u unicodu a ne u ansi encod-u!

Dopuna: 17 Jan 2008 11:34

provalio sam hvala!

Ko je trenutno na forumu
 

Ukupno su 849 korisnika na forumu :: 32 registrovanih, 5 sakrivenih i 812 gosta   ::   [ Administrator ] [ Supermoderator ] [ Moderator ] :: Detaljnije

Najviše korisnika na forumu ikad bilo je 3466 - dana 01 Jun 2021 17:07

Korisnici koji su trenutno na forumu:
Korisnici trenutno na forumu: 8u47, aramis s, Battlehammer, bojank, Brankoni, celik, dankisha, DonRumataEstorski, dragon986, Duško, jaeger, Koridor 11, kybonacci, Logic005, machak, mercedesamg, mikrimaus, milijarder, nenad81, panonski mornar, Petar35, royst33, Singidunumac, skvara, Skywhaler, SlaKoj, suton, uruk, vlvl, vobo, yamato, Yellow Pinky