Autor Zpráva
Ohnetta
Profil *
Zdravím mám menší probléms bordery. Mámn například 2 divy a oba mají rozměry v %. Např. #neco1 má width: 30%; float: left; a #neco2 bude mít width: 70%; float: left;... jenže když tam přidám bordery(rámečky) tak to pak přesahuje určitou šířku a pak se oba divy zobrazí podsebou. Existuje v CSS nějaká vlastnost který by narvala celý border do šířky toho divu ?
Trejpa
Profil
Ohnetta:
Existuje vlastnost box-sizing, která přepne počítání rozměrů tak, aby se do šířky započítával i padding a border-width. Některé prohlížeče na to mají značku s prefixem. Starší Internet Explorer (6, 7) však vlastnost box-sizing nezná a bude nutné ho shodit do quirku vhodným doctypem (třeba žádným), kde se takto počítají všechny rozměry bloků.

#neco1, #neco2 {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box; }
Bubák
Profil
Stará a osvědčená možnost je použít matrošku, tedy další obalový DIV. Která řešení je vhodnější použít, záleží na konktrétní situaci, já bych se rozhodoval hlavně podle toho, zda budu v IE potřebovat něco, co nové IE umí jen ve standardním režimu.
<!DOCTYPE HTML>
		<title>Titulek</title>
<style>
#neco1 {
	width: 30%;
	float: left;
}
#neco2 {
	width: 70%;
	float: left;
}
#neco1 .oramovany {
	border: 3px red double;
}
#neco2 .oramovany {
	border: 2px blue solid;
}
</style>

<div id=neco1>
	<div class=oramovany>Lorem ipsum dolor sit amet consectetuer. 
	</div>
</div>
<div id=neco2>
	<div class=oramovany>Fermentum Quisque amet Phasellus aliquet tincidunt
	id nulla orci. Parturient cursus velit tincidunt orci lobortis mi a
	quis odio. Sem a natoque amet semper ligula pretium enim et ipsum.
	</div>
</div>

Ale standardní způsob je, že si některé orámování namaluješ, budou to obrázky na pozadí, v případě jednoduché stránky stačí jeden. Koukni do zdrojáku téhle příkladové stránky: http://qu.wu.cz/webtest/jednoduche-schema-stranky.htm
habendorf
Profil
A co namísto borderu použít outline?
Trejpa
Profil
habendorf:
A co namísto borderu použít outline?
Internet Explorer 6 a 7 outline neumí.
Chamurappi
Profil
Reaguji na habendorfa:
Ten nebude uvnitř.
Prohlížeče, které umí outline, umí i box-sizing.

Vaše odpověď

Mohlo by se hodit

Odkud se sem odkazuje


Prosím používejte diakritiku a interpunkci.

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

0