Jump to content

Search the Community

Showing results for tags 'vertically'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • W3Schools
    • General
    • Suggestions
    • Critiques
  • HTML Forums
    • HTML/XHTML
    • CSS
  • Browser Scripting
    • JavaScript
    • VBScript
  • Server Scripting
    • Web Servers
    • Version Control
    • SQL
    • ASP
    • PHP
    • .NET
    • ColdFusion
    • Java/JSP/J2EE
    • CGI
  • XML Forums
    • XML
    • XSLT/XSL-FO
    • Schema
    • Web Services
  • Multimedia
    • Multimedia
    • FLASH

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


AIM


MSN


Website URL


ICQ


Yahoo


Jabber


Skype


Location


Interests


Languages

Found 1 result

  1. Hi everyone! I am trying to vertically center divs inside another div, using: position: relative;vertical-align: middle; But it's not working! Does anyone know why? On this page: http://www.jasonwangart.com/p/about-web.html , I am trying to make the dividers - the vertical black lines - be vertically centered within the parent div. You can see my code here: <!doctype html> <style> .jw-1-about-centre-align { width: 300%; border: 0px solid red; font-size: 16px; background-color: rgba(255,255,255,0.0); text-align: center; } .jw-2-about-pad { vertical-align: top; display: inline-block; min-width: 60px; padding: 0px 0px 0px 0px; border: solid rgba(0,0,0,0.2); border-width: 0px 1px 0px 1px; border-radius: 15px 15px 15px 15px / 30px 30px 30px 30px; margin: 0px auto 0px auto; text-align: left; font-size: 16px; background-color: rgba(255,255,255,0.3); } .jw-3-about-column { vertical-align: top; display: inline-block; border: 0px solid orange; width: 300px; height: 100%; margin: 10px 15px 10px 15px; } .jw-3-about-divider { display: inline-block; border: 0px solid green; width: 1px; height: 300px; margin: 0px 0px 0px 0px; background-color: rgba(0,0,0,0.5); position: relative; vertical-align: middle; } .jw-4-about-text-header { width: 100%; border: 0px solid green; margin: 20px auto 20px auto; font-size: 1.2em; font-weight: bold; font-style: italic; } .jw-4-about-text-body { width: 100%; border: 0px solid yellow; margin: 20px auto 20px auto; }</style> <div class="jw-1-about-centre-align"> <div class="jw-2-about-pad"> <div class="jw-3-about-column"> <div class="jw-4-about-text-header"> About me: </div> <!-- JUST SOME CODE FOR THE TEXT - OMITTED FOR SIMPLICITY --> </div> <div class="jw-3-about-divider"> </div> <div class="jw-3-about-column"> <div class="jw-4-about-text-header"> <b>Contact me:</b> </div> <!-- JUST SOME CODE FOR THE FORM - OMITTED FOR SIMPLICITY --> </div> <div class="jw-3-about-divider"> </div> <div class="jw-3-about-column"> <div class="jw-4-about-text-header"> <b>Email updates:</b> </div> <!-- JUST SOME CODE FOR THE FORM - OMITTED FOR SIMPLICITY --> </div> </div> </div> </!doctype>
×
×
  • Create New...