Jump to content


Photo
- - - - -

Full width Buttons


Best Answer beardedavenger , 18 January 2013 - 06:19 PM

No you'll need to apply the display:block with CSS in the Custom CSS area, or inline like this;

 

 

 

<a href="http://www.thomashob...inking-alcohol/" class="btn btn-important" style="display:block;">Take the Readiness Quiz</a>
Go to the full post


  • Please log in to reply
7 replies to this topic

#1 maureen1671

maureen1671

    Advanced Member

  • Members
  • 37 posts
  • LocationMenifee CA
  • Country: Country Flag

Posted 17 January 2013 - 08:44 PM

I made a button :

 

[pl_button type="important" link="

Please Login or Register to see this Hidden Content

" ]
Schedule an Informational Consultation
[/pl_button]

 

And placed it in a box on the home page @ thhp://www.thomashoben.com   

 

I would like it to stretch the width of the Content Area (left of the Side Bar).

 

Is a button in a box the best way to get this look and how would I make it expand to the correct width (100%) ?

 

I am planning on putting the same looking clickable buttons in the footer columns so I would need something that will work there as well.  I currently have Text Widgets in the Footer Column Sidebar.

 

Thanks. 

 

Sample site that of the look they are trying to achieve (orange buttons)  

Please Login or Register to see this Hidden Content



#2 batman

batman

    Bat Learning

  • Members

  • 2084 posts
  • LocationBuenos Aires, Argentina
  • Framework Version:DMS
  • Country: Country Flag

Posted 17 January 2013 - 11:11 PM

Hi maureen1671

Please you try 

Please Login or Register to see this Hidden Content



#3 beardedavenger

beardedavenger

    Unicorn Wrangler

  • Members

  • 1219 posts
  • Country: Country Flag

Posted 17 January 2013 - 11:35 PM

Nah use display:block.

 

P.S-  FYI you have some JS errors on your site, including jquery 1.5.1 which is badly outdated.



#4 maureen1671

maureen1671

    Advanced Member

  • Members
  • 37 posts
  • LocationMenifee CA
  • Country: Country Flag

Posted 18 January 2013 - 05:38 PM

Like this? 

 

[pl_button type="important" display:block link="

Please Login or Register to see this Hidden Content

" ]Take the Readiness Quiz[/pl_button]

 

That did not work.  I must not have done it correctly.



#5 beardedavenger

beardedavenger

    Unicorn Wrangler

  • Members

  • 1219 posts
  • Country: Country Flag

Posted 18 January 2013 - 06:19 PM   Best Answer

No you'll need to apply the display:block with CSS in the Custom CSS area, or inline like this;

 

 

Please Login or Register to see this Hidden Content



#6 maureen1671

maureen1671

    Advanced Member

  • Members
  • 37 posts
  • LocationMenifee CA
  • Country: Country Flag

Posted 18 January 2013 - 09:31 PM

<p>Ok, I did this in the &lt;&gt;Custom Code, CSS/LESS rules and it great, thank you!:<br />
<br />
<br />
.btn-important {<br />
display:block;}<br />
<br />
<br />
PS: I love the hat....and the blink</p>

#7 evscicats

evscicats

    Advanced Member

  • Members

  • 77 posts
  • Framework Version:DMS 2.0.6
  • Country: Country Flag

Posted 15 February 2013 - 08:45 PM

Can you use this with a split button dropdown?  What is the class for the split button btw and how would you set that up?



#8 evscicats

evscicats

    Advanced Member

  • Members

  • 77 posts
  • Framework Version:DMS 2.0.6
  • Country: Country Flag

Posted 18 February 2013 - 05:31 AM

Please Login or Register to see this Hidden Content

Changed my mind on the split button and decided on a regular dropdown button.  Here's my code but it doesn't span the width of the sidebar using the block style.  I also tried the btn-block as a class and it didn't work either.  Any other recommendations to make it work?