Autor Zpráva
Bratr_01
Profil *
#1 · Zasláno: 8. 11. 2010, 20:41:40 · Upravil/a: Moderátor (editace znemožněna)
Odpovědět Citovat
Potřeboval bych poradit, jak udělat v CSS ony bílé linky na bocích na ukázkovém obrázku - tady jsou jen "přimalované" v JPEGu. Dodělávám je dodatečně do hotového layoutu a nemůžu s tím hnout, vždycky se mi akorát rozhodí, co už mám hotové. Potřebuju také, aby se "natahovaly" podle výšky stránky, každá stránka je jinak dlouhá podle obsahu.

Umí to někdo vyřešit, jde to vůbec?

Díky moc, Bratr
Bratr_01
Profil *
#2 · Zasláno: 8. 11. 2010, 20:43:29 · Upravil/a: Moderátor (editace znemožněna)
Odpovědět Citovat
Ještě přidávám kód stránky: 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="cz">
<head>
<title>Title</title>
<meta http-equiv="Content-language" content="cs"> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="description" content=""> 
<meta name="keywords" content=""> 
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon"> 
<link rel="icon" href="favicon.ico" type="image/x-icon"> 
<meta name="author" content="">
<meta name="Copyright" content=""> 
<meta name="design" content="">
<link rel="stylesheet" type="text/css" href="default.css" title="default">
</head>

<body> 
<div id="Obal"> 
<div id="Hlava"> 
<div class="pozice">
</div>
</div>
<div id="Centralni"> 
<div align="center">
<div class="menu"> 
<ul>
<li><a class="vybrano" href="index.htm">Odkaz1</a></li>
<li><a href="2.htm">Odkaz 2</a></li>
<li><a href="3.htm">Odkaz 3</a></li>
<li><a href="4.htm">Odkaz 4</a></li>
<li><a href="5.htm">Odkaz 5</a></li>
<li><a href="6.htm">Odkaz 6</a></li>
<li><a href="7.htm">Odkaz 7</a></li>
<li><a href="8.htm">Odkaz 8</a></li>
</ul>
</div>
</div>
<div id="Levy">
<h2 class="leva_hlava"></h2> 
<p class="levy_obsah">
</p> 
</div>
<div id="Pravy">
<h2 class="leva_hlava"></h2> 
<div class="pravy_obsah">
</div>
</div>
<div class=""></div> 
</div>
<p class="spodni">
</div>
</body>
</html>
Bratr_01
Profil *
#3 · Zasláno: 8. 11. 2010, 20:44:03 · Upravil/a: Moderátor (editace znemožněna)
Odpovědět Citovat
A kód CSS: 

*{
padding:0;
margin:0;
}

body
{
	background-color: #999999;
	background-image: url("img/textura-zula.jpg");
	background-repeat: repeat;
	font-family: verdana;
	font-size: 12px;
	color: black;
}

a:link
{
color: black;
font-weight: bold;
}

a:visited    
{
color: black
}

a:hover  
{
color: white
background-color: black
}

tabulka
{
border: 0;
padding: 4;
border-spacing: 4;
width: 750px
}

h1
{
	font-size: 18px;
	padding-left: 50px;
	line-height: 45px;
	margin-left: 3px;
}

h2
{
	font-size: 18px;
}

h3
{
	font-size: 12px;
	line-height: 20px;
	font-weight: bold;
	padding-left: 10px;
}

#Obal
{
	width: 1000px;
	margin: 0px auto;
}

#Hlava
{
  background: url("img/header.gif") top left no-repeat;
  width: 1000px;
	height: 150px;  
	float: left;
	margin-top: 9px;
}

#Centralni
{
	width: 1000px;
	margin-left: 0px;
	clear: both;
	padding-top: 9px;
}

#Levy
{
	background-color: #B8B8B8;
	float: left;
	padding-top: 25px;
	padding-bottom: 25px;
	min-height: 550px;
	height: 400x;
	width: 448px;
	margin-top: 10px;
	margin-left: 30px;
}

*>#Levy
{
	height: auto;
}

#Pravy
{
	background-color: #B8B8B8;
	float: right;
	padding-top: 25px;
	padding-bottom: 25px;
	min-height: 550px;
	height: 400x;
	width: 448px;
	margin-top: 10px;
	margin-right: 30px;
}

*>#Pravy
{
	height: auto;
}

#center
{
	background-color: #B8B8B8;
	float: left;
	padding-top: 25px;
	padding-left: 50px;
	padding-bottom: 25px;
	min-height: 550px;
	height: 400x;
	width: 800px;
	margin-top: 10px;
	margin-left: 75px;
}

*>#center
{
	height: auto;
}

.pozice
{
  position: relative;
	left: 10px;
	top: 130px;
	color: white; 
}

.pozice2
{
  position: relative;
	left: 10px;
	top: 0px;
	color: white;
	font-size: 20px; 
}

.menu
{
	width: 1000px;
	font-family: verdana;
	font-size: 12px;
	font-weight: bold;
	font-style: normal;
	text-decoration: none;
}

.menu ul
{
	margin: 0;
	padding: 0;
	float: center;
	width: 100%;
	background: #000000;
	border-top-width: 1px;
	border-right-width: 0px;
	border-bottom-width: 1px;
	border-left-width: 0px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #FFFFFF;
	border-right-color: #FFFFFF;
	border-bottom-color: #FFFFFF;
	border-left-color: #FFFFFF
}

.menu ul li
{
display: inline;
}

.menu ul li a
{
	float: center;
	color: #FFFFFF;
	padding: 0px 11px;
	text-decoration: none;
	border-right-width: 2px;
	border-left-width: 2px;
	border-right-style: solid;
	border-left-width: solid;
	border-right-color: #FFFFFF;
	border-left-color: #FFFFFF;
}

.menu ul li a:visited{
color: #FFFFFF;
}

.menu ul li a:hover, .h_mnu_01 ul li .selected{
	color: #000000 !important;
	padding-top: 5px;
	padding-bottom: 5px;
	background: #FFFFFF;
}

.vybrano
{
  color: #000000 !important;
	padding-top: 5px;
	padding-bottom: 5px;
	background: #FFFFFF;
}

.cistic
{
    clear: both;
}

.levy_artikl
{
    float: left;
	  padding-top: 20px;
}

.leva_hlava
{
	padding-left: 50px;
	padding-bottom: 17px;
}

.levy_obsah
{
	padding: 5px 50px 10px 40px;
	text-align: justify;
}

.levy_obsah2
{
	padding: 5px 10px 10px 50px;
	text-align: justify;
	height: 200px;
}

.pravy_artikl
{
    padding-top: 20px;
}

.prava_hlava
{
	padding-left: 270px;
	padding-bottom: 17px;
}

.pravy_obsah
{
  padding: 5px 30px 10px 50px;
	text-align: justify;
}

.pravy_obsah2
{
	text-align: justify;
	color: black;
	padding: 5px 50px 10px 50px
}

.novinkova_hlava
{

	line-height: 45px;
	padding-left: 270px;
}

.spodni
{
	background-color: #B8B8B8;
	float: left;
	width: 1000px;
	text-align: center;
	margin-top: 20px;
	margin-bottom: 10px;
	padding-top: 10px;
	padding-bottom: 10px;
	font-size: 11px;
}

.spodni a
{
    color: #5a5551;
}

#iframe-div { height:auto; }
xmark
Profil
#4 · Zasláno: 8. 11. 2010, 20:49:10
Odpovědět Citovat
Bratře, tohle se nikomu nebude chtít zkoumat. Navíc tady chybí css, což je (nejen) pro definici vzhledu okrajů záležitost docela podstatná. Dej sem odkaz na živou ukázku, někdo ti poradí mnohem spíš.
Bratr_01
Profil *
#5 · Zasláno: 8. 11. 2010, 21:11:40
Odpovědět Citovat
CSS tu prece je, zobrazil sis to zrejme driv, nez jsem to sem stacil nahrat, ale prece jen ukazka je tady:

Ukazka

ale chybi tam to podstatne - ty bile linky na okrajich, ty jsou na obrazku jen primalovane v JPEG, nevim jak je tam dostat... ;-)
xmark
Profil
#6 · Zasláno: 9. 11. 2010, 21:45:12
Odpovědět Citovat
Bratr_01:
Obal ty dva šedé divy jedním divem a nastav mu border-left, border-right.
Bratr_01
Profil *
#7 · Zasláno: 11. 11. 2010, 01:05:42
Odpovědět Citovat
Geniální věci jsou naprosto jednoduché a přitom ne a ne na ně přijít, když potřebujete... :-D

Díky moc, funguje to přesně tak, jak jsem si představoval... ;-)
Časová prodleva: 13 let

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm:

0