html - Border Right is being set on the opposite of the page -


when place border on right of text border @ right of page, not right of text. i've removed default border properties of browser , result still same.

on code pen third result want border on right.

example: http://codepen.io/twig941/pen/zoqexx

code:

<div class = "logo"> 3 words </div> <br> <br> <br> <br> <div class = "ideal-logo">      <br>   3   <br>   words </div>  <div class = "ideal-left">        <br>   3   <br>   words </div>  .logo {   border-right: 10px solid black; }  .ideal-logo {   border-right: 5px solid black; }  .ideal-left {   border-left: 5px solid black; } 

use display: inline-block; on .logo & .ideal-logo. block elements why flowing end-to-end.

here snippet, have look:

.logo {    display: inline-block;    border-right: 10px solid black;  }    .ideal-logo {    display: inline-block;    border-right: 5px solid black;  }    .ideal-left {    border-left: 5px solid black;  }
<div class = "logo">  3 words  </div>  <br>  <br>  <br>  <br>  <div class = "ideal-logo">        <br>    3    <br>    words  </div>    <div class = "ideal-left">          <br>    3    <br>    words  </div>

hope helps!


Comments

Popular posts from this blog

asp.net - How to correctly use QUERY_STRING in ISAPI rewrite? -

jsf - "PropertyNotWritableException: Illegal Syntax for Set Operation" error when setting value in bean -

laravel - Undefined property: Illuminate\Pagination\LengthAwarePaginator::$id (View: F:\project\resources\views\admin\carousels\index.blade.php) -