box model con angoli arrotondati

**AlexShot** · 09-01-2010, 14:30

salve a tutti ho un problema, aiutatemi a risolverlo

dunque sto creando un box con angoli arrotondati seguendo questa lezione:

http://webdesign.html.it/articoli/le...enza-immagini/ s

olamente che non mi vengono i margini a dx e a sx... il codice che utilizzo è questo:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>box angoli arrotondati</title>
<style type="text/css">
b.rtop, b.rbottom{display: block; background: #FFF}
b.rtop b, b.rbottom b{display: block; height: 1px;
overflow: hidden; background: #76C2FA}
b.r1{margin: 0 5px}
b.r2{margin: 0 3px}
b.r3{margin: 0 2px}
b.rtop b.r4, b.rbottom b.r4{margin: 0 1px; height: 2px}
</style>
</head>

<body>
<div>
<b class="rtop">
<b class="r1">[/b]
<b class="r2">[/b]
<b class="r3">[/b]
<b class="r4">[/b]
[/b]
blaaaaaaaaaaaaaaaaa
<b class="rbottom">
<b class="r4">[/b]
<b class="r3">[/b]
<b class="r2">[/b]
<b class="r1">[/b]
[/b]

</body>
</html>

dove sbaglio?

Grazie

**marco.carrieri** · 09-01-2010, 21:14

Credo ti fossi dimenticato di aprire il div con id nitify...

Codice PHP:


<div id="nifty">

<b class="rtop"><b class="r1">[/b]<b class="r2">[/b]<b class="r3">[/b]<b class="r4">[/b][/b]

testo

<b class="rbottom"><b class="r4">[/b]<b class="r3">[/b]<b class="r2">[/b]<b class="r1">[/b][/b]

</div>

**AlexShot** · 10-01-2010, 15:54

scusami potresti spiegarmi bene.... cmq il codice che utilizzo l'ho copiato sulla guida del webdesign di html.it...

PS - un box con angoli arrotondati nn mi riesce proprio

**marco.carrieri** · 10-01-2010, 18:28

Prova questo codice che a me funziona benissimo.

Codice PHP:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html>

    <head>

        <title>prova</title>

        <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">

        <meta name="generator" content="HAPedit 3.1">

        <style type="text/css">

            div#nifty{ margin: 0 10%;background: #9BD1FA}

            b.rtop,b.rbottom{display:block;background:#FFF}

            b.rtop b,b.rbottom b{display:block;height:1px;overflow:hidden;background:#9BD1FA}

            b.r1{margin:0 5px}

            b.r2{margin:0 3px}

            b.r3{margin:0 2px}

            b.rtop b.r4,b.rbottom b.r4{margin:0 1px;height: 2px}

        </style>

    </head>

    <body>

        <div id="nifty">

            <b class="rtop"><b class="r1">[/b]<b class="r2">[/b]<b class="r3">[/b]<b class="r4">[/b][/b]

            prova

            <b class="rbottom"><b class="r4">[/b]<b class="r3">[/b]<b class="r2">[/b]<b class="r1">[/b][/b]

        </div>

    </body>

</html>

**AlexShot** · 12-01-2010, 10:53

sei stato magnifico

mi spiegheresti però il codice ?

**marco.carrieri** · 12-01-2010, 17:31

Era come quello tuo solo che a differenza del tuo io ho messo l'id del div.

<div id="nifty">
invece di
<div>

Discussione: box model con angoli arrotondati

Strumenti discussione

Ricerca discussione

Visualizza

box model con angoli arrotondati

Permessi di invio