Webmaster Forum

Go Back   Webmaster Forum > Web Development > Coding Forum

Coding Forum Problems with your code? Discuss coding issues, including JavaScript, PHP & MySQL, HTML & CSS, Flash & ActionScript, and more.


Reply
 
LinkBack Thread Tools Display Modes
Share |
  #1 (permalink)  
Old 02-20-2015, 06:01 AM
yangyang's Avatar
Contributing Member
 
Join Date: 08-30-07
Posts: 228
iTrader: 0 / 0%
Bootstrap 3.3.2 fixed width column on large screen but stacks on small screen?

How to make a column in Bootstrap 3.3.2 to be fixed width on large screen (min-width: 768px) but also stacks on small screen (max-width: 767px)?

Did some research and found this solution works half the puzzle, but how to further make it stacks on small screen like a responsive column is doing?

Thus far I tried:

Code:
@media (max-width: 767px) { .col-fixed-160 { width:100%; } .col-fixed-240 { width:100%; } }
But it doesn't work. Any idea?
__________________
Large and authoritatively Usable Databases from The Data Planet, comparable to those that power Google and Amazon.
 
Reply With Quote

Advertisement

Advertisement

  #2 (permalink)  
Old 02-20-2015, 12:57 PM
raicabogdan's Avatar
Contributing Member
 
Join Date: 10-03-08
Location: On the web
Posts: 116
iTrader: 0 / 0%
Since you're using Bootstrap, why not use the grid system already provided?

col-sm-* - is for devices higher or equal to 768px
col-xs-* - is for devices lower than 768px

so based on these, you can create a grid stack for the specific devices like so:
HTML Code:
<div class="container"> <div class="col-xs-6 col-sm-6"></div> <div class="col-xs-6 col-sm-6"></div> </div>
where both divs will use half the allocated parent width on devices with higher than or lower than 768px. Also don't forget to use the container.
__________________
Tutorials and how to's for programming and server related configurations! www.yourhowto.net
 
Reply With Quote
Go Back   Webmaster Forum > Web Development > Coding Forum

Reply


Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are Off
Pingbacks are Off
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Stop designing for screen width, design for content HTMLBasicTutor Web Design Lobby 4 12-12-2012 05:18 PM
Fluid vs Fixed Width chicgeek Web Design Lobby 122 11-11-2011 06:13 PM
Fixed width vs. Fuid design; Which one is better? gridsix Coding Forum 1 03-03-2009 08:56 AM
Screen Resolution & Width of the Screen for Business Applications jelumalai Web Usability 1 12-21-2008 04:13 PM


V7N Network
Get exposure! V7N I Love Photography V7N SEO Blog V7N Directory


All times are GMT -7. The time now is 04:39 AM.
Powered by vBulletin
Copyright 2000-2014 Jelsoft Enterprises Limited.
Copyright © 2003 - 2014 Escalate Media




Search Engine Optimization by vBSEO 3.6.0 RC 2 ©2011, Crawlability, Inc.