Jump to content
Sign in to follow this  
tejasamrute

Double Border Header

Recommended Posts

I want to create a dynamic header like the image attached...

 

By dynamic i mean the borders should adjust according to the length of the text

post-175359-0-04102700-1417178906_thumb.jpg

 

 

Help Appreciated

 

 

Edited by Tezzo

Share this post


Link to post
Share on other sites

There are two ways to do that. One is to float the element to the left or to the right, theother way is to set the display to "inline-block".

 

Both of the options will cause content that follows the box to be rendered next to it. The solution to that is different for each case:

  • In the case of using "float", set clear: both on the element that follows it.
  • In the case of display: inline-block the element that follows it should be a block element or be wrapped in a block element,

Share this post


Link to post
Share on other sites

i just realised... the reason i attached the design of the header was to show the variation in the length of the texts.....they are headers of different pages

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

×
×
  • Create New...