Jump to content
omahpohon

Adding border to my web page

Recommended Posts

omahpohon    0
omahpohon

I would like to be able to add borders around things like the content area and sidebar widgets. Not a big border but borders around each specific widget or box. It really makes the design look cleaner and I would like to know how to do this?

Edited by omahpohon (see edit history)

Share this post


Link to post
Share on other sites
batman    389
batman

You can try add in

PageLines > Site Options > Custom Code > CSS Rules

or in

Pagelines Customize (plugin)

It is advisable to learn how to do this on your own too.  

Check out 

http://support.pagel...ion/custom-css/

 

If you need more CSS help, make sure you've downloaded Firebug for Firefox

and check out W3 Schools for more info. 

http://www.w3schools.com/You can try add in

PageLines > Site Options > Custom Code > CSS Rules

or in

Pagelines Customize (plugin)

For example for the widget

 

.widget-pad {
border-top-left-radius: 5px 5px;
border-top-right-radius: 5px 5px;
border-bottom-left-radius: 5px 5px;
border-bottom-right-radius: 5px 5px;
border: 1px solid white;
box-shadow: 1px 2px 4px rgba(0, 0, 0, .5);}

It is advisable to learn how to do this on your own too.  

Check out 

http://support.pagel...ion/custom-css/

 

If you need more CSS help, make sure you've downloaded Firebug for Firefox

and check out W3 Schools for more info. 

http://www.w3schools.com/

specially

http://www.w3schools.com/css/css_border.asp

  • Like 1

Life is too short to remove USB safely ...

Share this post


Link to post
Share on other sites
omahpohon    0
omahpohon

thanks Batman your css widget helped me :)

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now


  • Similar Content

    • Jared Smith
      By Jared Smith+
      I'm trying to make a visible border around the entirety of a client's site.  Example on some other site here:
      http://www.makeyourvisionreal.com/movement

      So it is around the Title, Menu, and Content Area.  I'm having a bit of difficulty with this on pagelines, using the Framework theme. It's slightly more complex because the site has a "landing page" that doesn't need the border. Much like this homepage
      http://www.makeyourvisionreal.com/
       
      Right now I'm using a content width of 80%, and fullscreen.  But maybe thats not the best way to do it.  
       
      So, with the #site id, I can hit the whole area on most of the site, but I'm not sure how I can remove it for just one page.
      #site { border:1px solid #ccc; margin: 100px 5% 5% 50px; } anyone have any suggestions?  Maybe I need to go make a child template, not sure?  Thanks!
    • Michael Kummer
      By Michael Kummer+
      Hi guys,
      I have been unsuccessfully trying to get my 3-column widgetized footer aligned centered. The widget section itself is aligned left because the alignment appears to be controller the widget's content only. The container that contains the widget section is aligned centered. I have chosen a 3 column layout and I added 3 widgets, assuming they would be aligned centered.
      Any idea of what I may be doing wrong?
      The page is question is: http://www.michaelkummer.com
      Thanks
      Michael
    • novusweb
      By novusweb+
      We're seeing an abnormal break in widgets in Safari (El Capitan v10.11.4). 3 Widgets set for 4 of 12 columns each breaks correctly in Chrome and Firefox, but the 3rd widget goes to another line in Safari.
      Screenshot attached.
      Hoping there's a CSS fix you could recommend in the meantime, until an update. You can see this on our home page: www.novusweb.com.
    • hibbsy78
      By hibbsy78+
      I have an issue with the widgets on my blog post page. The Facebook widget is being shifted up and next to the Mumii widget above...? How can I force it to remain underneath?
      http://www.viewfromadaddy.co.uk/bellissimo-pizza-recipe/


    • photomom86
      By photomom86+
      I just purchased the DMS framework and the Sophistique child theme. I am needing help with setting the content or body font size... the content in a blog post only.
       
      I have the global font size set to 18px and then I have this custom code in the custom css area
       
      body{ font-size:22px !important;}
       
      but this code also changes the font size of the Sophistique contact bar... which I do not want. Anyone know the code to only change the font size in the blog post content area only?
       
      Or vice versa, I could set the global font to 22px and then use custom code for the contact bar font in custom css.
       
      I've tried to use the chrome developer tools to figure this out to no avail. Thanks!
       
      url is stagegecg.com
       
×