Problém s margin – CSS – Fórum – Programujte.com
 x   TIP: Přetáhni ikonu na hlavní panel pro připnutí webu
Reklama
Reklama

Problém s margin – CSS – Fórum – Programujte.comProblém s margin – CSS – Fórum – Programujte.com

 

Hledá se programátor! Plat 1 800 € + bonusy (firma Boxmol.com)
21. 8. 2007   #1
-
0
-

Zdravím mám takový problém potřeboval bych zarovnat ten horní header úplně k vrchu a i ten bar k headeru nevím jak přesně na to tady to je

http://www.edisk.cz/stahni/87880/webfuck.rar_45.62KB.html
. Jo a ještě bych se zeptal jak jak dát v dreamweaveru obrázek na obrázek. Konkrétně myslím buttony na tu navigační plochu.

Nahlásit jako SPAM
IP: ...–
GUNS N ROSES 4ever
Reklama
Reklama
Mautinek
~ Redaktor
0
Grafoman
21. 8. 2007   #2
-
0
-

Tady jsem ti to trošku přepracoval:
http://www.edisk.cz/stahni/44428/web.rar_42.29KB.html

Jinak na Dreamweaver se vykašli a začni psát kód sám.
Obrázek dáš na pozadí v CSS: background { url(cesta_k_obrazku); } http://www.jakpsatweb.cz/css/background.html

Nahlásit jako SPAM
IP: ...–
Programujte.com redaktor
Sleduj mě na @MartinSimko
Petroff0
Věrný člen
22. 8. 2007   #3
-
0
-

Myslíš tu navigaci takhle (vedle obrázku)?

<!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" xml:lang="cs" lang="cs">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>XXXX - základní rozložení</title>
<style>
* { margin: 0px; padding: 0px }

/* _____________________ SIMULACE OBRAZKU */
#IMG { border: 0px solid; width: 600px; height: 143px; font: 100px/143px Arial;
text-align: center; background:black; color:white }
/* ^^^^^^^^^^^^^^^^^^^^^->ZMĚNIT PO VLOŽENÍ OBRÁZKU */

html { background: white; /* BARVA L+P OKRAJE */
text-align: center } /* <-Centruje */
body { margin: 0 auto; /* <-stránku */
width: 760px; /* =[šířka stránky]=[navigace+obsah] */
text-align: left;
background: gray; /* BARVA STRANKY */
font: 14px serif;
}
#obsah { margin-left: 160px; width: 600px; } /* =[šířka navigace] */

p,.uvnitr { margin:2px;
padding:1ex;
background: #AAF; /* BARVA text.bloku */
color: blue; /* BARVA pisma */
}
/******************************** Navigace *********************************************/
div#nav { float:left;
width: 160px;
background: #DDD; /* BARVA NAVIGACE */
}
div#nav ul { list-style: none;
width: 145px; /* =[šířka MENU] */
margin: 5px auto 333px auto; /* [okraje MENU] */
background: #AAF; /* BARVA MENU */
border: 1px solid white;
}
div#nav li { border: solid 1px white }
#nav a { display: block;
width: 92%;
padding: 6px;
text-decoration: none;
font: bold 12px/1 Arial;
}
#nav a:hover { /* Vybrana polozka: */
background: #FFF; /* BARVA */
}
/******* Styly jen pro IE6 **********************/
* html #obsah { margin-left: 0px; height: 1em } /* >> IE6 obsahuje chyby, které potlačí tyto 2 definice */
* html #nav { margin-right: -3px } /* >> V jiných prohlížečích se neuplatní */
</style>
</head>
<body>

<div id="nav">
<ul>
<li><a href="#">aaaaaaaaaa</a></li>
<li><a href="#">bbbbbbbb</a></li>
<li><a href="#">ccccc ccc</a></li>
<li><a href="#">ddddddddddddd</a></li>
<li><a href="#">eeeeeeeeeeeeeeee</a></li>
<li><a href="#">ffffff</a></li>
<li><a href="#">gggggg</a></li>
<li><a href="#">hhhhhh</a></li>
</ul>
</div>

<div id="obsah">
<div id="IMG"> OBRÁZEK </div> <!-- <img src="....header.jpg" alt="header" /> -->
<div class="uvnitr"><h4>Článek 1</h4>aaaabbbbccccdddd
</div>
<div class="uvnitr"><h4>Článek 2</h4>aaaabbbbccccdddd
</div>
<p>text text text text text text text text text text text text text text text
text text text text text text text text text text text text text text text </p>
<p>text text text text text text text text text text text text text text text
text text text text text text text text text text text text text text text </p>
<p>text text text text text text text text text text text text text text text
text text text text text text text text text text text text text text text </p>
</div>

<div style="clear:left; text-align:center; background:yellow">
========================== pata ==============================
</div>

</body>
</html>

Jinak dělat stránku v DW a současně vnášet do kódu ruční úpravy nepovažuju za šťastný způsob,
to je lepší dělat celou ručně (případně vyjít z nějakého "polotovaru").

Nahlásit jako SPAM
IP: ...–
Mautinek
~ Redaktor
0
Grafoman
22. 8. 2007   #4
-
0
-

To Petroff: je malá poznámka... ve Strictu nejsou povoleny tagy psát velkými písmeny ;-)

Nahlásit jako SPAM
IP: ...–
Programujte.com redaktor
Sleduj mě na @MartinSimko
Petroff0
Věrný člen
22. 8. 2007   #5
-
0
-

Díky.Já to spravím, tak to vypadá, když nezačínáš od nuly, ale upravuješ...normálně už jsem zvyklý psát vše malým.
(Taky tam mám 2x <html> !!!) (A konečně tam můžu tam dodat styly pro IE6, až teď jsem na ně přišel)

Nahlásit jako SPAM
IP: ...–
Mautinek
~ Redaktor
0
Grafoman
22. 8. 2007   #6
-
0
-

To Petroff: jj jasný, občas to bylo malý, občas velkým :-)

Nahlásit jako SPAM
IP: ...–
Programujte.com redaktor
Sleduj mě na @MartinSimko
Zjistit počet nových příspěvků

Přidej příspěvek

Toto téma je starší jak čtvrt roku – přidej svůj příspěvek jen tehdy, máš-li k tématu opravdu co říct!

Ano, opravdu chci reagovat → zobrazí formulář pro přidání příspěvku

×Vložení zdrojáku

×Vložení obrázku

Vložit URL obrázku Vybrat obrázek na disku
Vlož URL adresu obrázku:
Klikni a vyber obrázek z počítače:

×Vložení videa

Aktuálně jsou podporována videa ze serverů YouTube, Vimeo a Dailymotion.
×
 
Podporujeme Gravatara.
Zadej URL adresu Avatara (40 x 40 px) nebo emailovou adresu pro použití Gravatara.
Email nikam neukládáme, po získání Gravatara je zahozen.
-
Pravidla pro psaní příspěvků, používej diakritiku. ENTER pro nový odstavec, SHIFT + ENTER pro nový řádek.
Sledovat nové příspěvky (pouze pro přihlášené)
Sleduj vlákno a v případě přidání nového příspěvku o tom budeš vědět mezi prvními.
Reaguješ na příspěvek:

Uživatelé prohlížející si toto vlákno

Uživatelé on-line: 0 registrovaných, 10 hostů

Podobná vlákna

Float-right způsobí "margin"? — založil Radek Chalupa

Iphon - margin: 0 auto; — založil Jaratyp

2 divy inline-block extra margin-top — založil Codemaster

 

Hostujeme u Českého hostingu       ISSN 1801-1586       ⇡ Nahoru Webtea.cz logo © 20032016 Programujte.com
Zasadilo a pěstuje Webtea.cz, šéfredaktor Lukáš Churý